jQuery（五）

      fade动画

•淡入是显示     fadeIn()

•淡出是隐藏     fadeOut()

•切换淡入淡出 fadeToggle()

•透明度动画     fadeTo(时间,透明度)

–例： $('ul li').stop().fadeTo(300,1);

•注：参数都可以是毫秒值或者’slow’、’normal’、’fast’，只要有动画存在，尽量在动之前先给stop()。

 

      animate（） 自定义动画

•会有一个过度的效果，（必须是有数值的属性才能动画）

•$(‘.all’).animate({‘width’:‘100px’,‘height’:‘100px’},1000);

•两个参数：第一个是要设置的值和属性，第二个值是运动的时间。

•$(‘.all’).css(‘height’,‘0px’).animate({‘height’:‘200px’},1000);//模拟slideDown。

•其实jquery中所有的动画都是由animate（）方法来的。

•delay()  暂停动画，参数是停止几秒。

 

      each() 遍历函数

•可以理解为jquery帮我们做了js中for循环的工作。也就是把选中的元素挨个进行处理。

•两个参数 第一个是 索引值，第二个是 要循环的元素。

•例：

$('ul li p').each(function(index,element){

         num = -index * 25;

         $(element).css({'background-position':'10px '+num+'px'});

})

 

      事件坐标

•我们在匿名函数中写一个小e，这个e表示事件本身

•e.pageX  横坐标

•e.pageY  纵坐标

•获取事件发生的坐标值。

•给document设置mousemove()方法来获取坐标信息。

•鼠标移动事件：mousemove() 当鼠标移动的时候触发的事件（鼠标每移动1像素的时候 就会触发一次）

 

      元素偏移

•scroll 事件：表示鼠标或滚动条滚动的时候触发。

•$(document).scorllTop()  可以获得当前网页滚动后，距离顶部的位移。

•有道面试考题：position 属性的默认属性是什么？static

•offset().top  获得元素距离顶端的距离

•offset().left  获得元素距离左端的距离

•锚点一般都是跟着定位跟随的导航一起做的。为了用户体验。