- 浏览: 22282 次
- 性别:
文章列表
图片的轮播(轮播图)
- 博客分类:
- jquery
首先,既然使用了jquery,制作方法就不再是最基础的那种将图片列表的位置一直改变,例如:切第二张图片left:-100px,切第三种图片left:-200px等等。这种方法在从最后一张图回第一张图时会快速倒回去进行轮播(肯定不是你想要的对不对)
其次,制作目标是轮播基本的三个功能:自动播放 ;光标移入停止播放,移开继续播放 ;按钮操作前/后张图片切换。
再然后,制作图片轮播的方法网上非常多,用插件几行代码就可以搞定但是你看不见代码不理解,so我自己理解整理了下代码。
html代码
<!doctype html>
<html lang="zh-CN ...
通过jquery的css方法,设置div隐藏
代码如下:
$("#sendPhoneNum").css("display", "none");
hide()函数,如果被选的元素已被显示,则隐藏该元素。
语法:
$(selector).hide(speed,callback)
实现隐藏,括号里可以带一个时间参数(毫秒)例如hide(2000)以2000毫秒的速度隐藏,还可以带带slow,fast
show()函数
语法:
*.show(speed, [callback])
显示所有匹配的元素,并在显示完成后可选 ...
鼠标的移入移出事件:hover、mouseenter、mouseleave、mouseover、mouseout
hover:鼠标进入元素的子元素时不会触发‘鼠标移开’的事件;
$("#"+id).find("tr").hover(function(){
$(this).css({"backgruond-color","pink"});//当鼠标移进 触发事件
},function(){
$(this).css({"backgruond-color",&q ...
z-index
- 博客分类:
- JavaScript
z-index 属性是设置元素的堆叠顺序。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素前面。 该属性的属性值可以拥有负值;
z-index : auto | number
auto:默认值。number:无单位的整数值,可为负数。最大100。
z-index 值较大的元素将叠加在z-index值较小的元素之上。对于未指定此属性的定位对象,z-index 值为正数的对象会在其之上,而z-index 值为负数的对象在其之下。
z-index属性适用于定位元素(position 属性值为 relative 或 absolute 或 fixed的对象),用来确定定位元素在 ...
动画效果
- 博客分类:
- JavaScript
animate() 方法执行 CSS 属性集的自定义动画。
通过改变CSS样式将元素从一个状态改变为另一个状态。CSS属性值是逐渐改变的。
语法:
$(selector).animate(styles,speed,easing,callback)
styles:必需,规定产生动画css样式效果。
speed:可选,规定动画速度有四个值(单位:毫秒)
默认是 "normal"。
毫秒 (比如 1500)
1、slow
2、normal
3、fast
相对定位:如果对一个元素相对定位的话,然后,可以通过设置垂直或水平位置,让这个元素相对于它的本身进行移动。属性并没有脱离文档流的,所以元素本身所占的位置会保留。。因此,移动元素会导致它覆盖其它框。(相对定位实际上被看作普通流定位模型的一部分,因为元素的位置相对于它在普通流中的位置。)
例子:
<html>
<head>
<style type="text/css">
h2.pos_left
{
position:relative;
left:-20px
}
h2.pos_right
{
position:rela ...
下划线滑动
- 博客分类:
- JavaScript
下划线滑动,
最后一个li空着,留着后面有用,通过绝对定位,把最后一个 li.quebec 定位到导航下方,设置宽度高度。设置 transition,当我们改变 left, width的时候就能实现动画。
<div class="info">
<ul>
<li class="community"><a >社区</a></li>
<li class="support">& ...
javascript 代码整理
- 博客分类:
- JavaScript
javascript 文件命名:所有的文件名应该都遵循同一命名约定。减号(-)是用来分隔文件名的不二之选。文件命名总要以字母开头,而不是数字。(字母小写)
html规范
<!DOCTYPE html>
<meta charset="utf-8">
<title>Test </title>
不推荐:
<!DOCTYPE html>
<meta charset="utf-8">
<title>Test
这样省略不该省略的标签,就 ...
JSON 指的是JavaScript对象表示法,当我们建立一个JSON文件时,利用$.getJSON()调用。
$.getJSON()是专门为ajax获取json数据而设置的,并且支持跨域调用。
$.getJson()本身是异步操作的方法,需要经过设置才能够同步。因为是异步问题,当我们调用文件时,$.getJSON()根本没有执行,所以在方法下在保存,或者把$.getJSON()提到方法前面。
$.getJSON( url [, data ] [calldata ] )
下面来介绍下各个参数:
url:它是一个字符串一个包含发送请求的URL字符串。
data: ...
jquery tmpl模板
- 博客分类:
- jquery
jquery.tmpl模板是用模版生成html的框架其中的一种。
首先需要下载tmpl文本,引入到你的html文件中,在html文件中写代码
举例:
<!DOCTYPE html>
<html>
<body>
<head>
<script type="text/javascript" src="../jav ...
jquery元素选择器允许对html元素组或单个元素进行操作。
jquery所有选择器都是以$()开头。
首先jquery元素选择器:
$("b") 选取 <p> 元素。
$("b.into") //选取所有 class="into" 的 <b> 元素。
$("b#demo") //选取所有 id="demo" 的 <b> 元素。
选取class=“dosomething”元素jquery代码:
$(.dosomething)
选取id=“ ...
当我们点击按钮执行代码,向html事件添加javascript代码 执行代码
html:
<button type="submit" id="just">Bar</button>
js写法:
document.getElementById('#just').addEventListener('click', function() {
});//.getElementById返回拥有第一个id的指定对象
//addEventListener当该对象触发指定的事件时,指定的回调函数就会被执行。
jquery写 ...
.gitignore
- 博客分类:
- 终端
.gitignore:隐藏文件。当我们往git hup传文件时有一些系统生成,或者我们不需要的文件同时会传到我们建的工程上,那么烦人的文件可以通过.gitignore来隐藏起来。
首先我们先找到我们所需的文件,
git status
来查看状态,后编辑.gitignore文件
gedit.gitignore
会弹出一个文本编辑框,把不需要的文件写入进去 然后在把你往.gitignore文件里写的文件删除:
git rm -rf .idea/
之后在查看你的状态,不需要的文件就没有了
<a>标签:超链接,从一个页面链接到另一个页面
<a>标签的属性最重要的是href,它指定的是链接的目标
<a href>指定链接的URL
用法
<a href="value">
另外属性就是通过使用name和id,创建一个文档内部文件 ...
HTML+CSS基础
- 博客分类:
- css
学习了css样式之前用html
<body bgcolor-"#FF0000">
同样可以用css这样来写:
body{
background-color:#FF0000;
}
选择器:表明花括号中的属性设置将应用于哪些HTML元素例如“body”
属性:例如用于设置背景颜色的属性“background-color”等等
value:比如说background-color(背景颜色)属性的值可以是“#FF0000代表红色”
方法1 内部样式表(style元素)
为html应用的css的一种方法是使用html属性style我们在上例 ...