jQuery小结二

jQuery操作样式

参数只写属性名，则返回的是属性值

$(this).css("color")

参数是属性名，属性值，逗号分隔，是设置一组样式，属性要加引号，值如果是数字可以不用跟单位和引号

$(this).css("color","#f35")

参数可以是对象格式，方便设置多组样式，属性名和属性值用 : 冒号隔开

$(this).css({"color":"#fff","font-size":"20px"}) 

操作类名 

作用等同于以前的classList 可以操作类 里面的参数不要加点

添加类

$("div").addClass("current")

移除类

 $("div").removeClass("current")

切换类

$("div").toggleClass("current") 

和原生JS className的区别 原生 className会覆盖原先的类名，jQuery里 类操作只是对指定类进行操作，不影响原先的类名。

jQuery动画

jQuery给我们封装了很多动画效果，最为常见的如下：

显示掩藏 show()  hide() toggle()

上滑下滑 slideDown()  slideUp() slideToggle()

淡入淡出 fadeIn() fadeOut() fadeToggle()  fafeTo(指定透明度)

自定义动画 animate()

他们都可以传入对应的参数 参数都可以省略，无动画直接显示

显示隐藏、上滑下滑、淡入淡出参数

参数名	是否必填	描述
speed	可选	动画速度/时长   可用三种字符串 slow normal fast 或者数字500（单位：毫秒）
easing	可选	指定切换效果 默认 swing 可选 linear
fn	可选	回调函数 在动画完成时执行的函数 每个元素执行一次

fadeTo参数

参数名	是否必填	描述
speed	必填	动画速度/时长   可用三种字符串 slow normal fast 或者数字500（单位：毫秒）
opacity	必填	透明度 必须写 取值在0-1之间
easing	可选	指定切换效果 默认 swing 可选 linear
fn	可选	回调函数 在动画完成时执行的函数 每个元素执行一次

animate() 的参数

参数名	是否必填	描述
params	必填	想要修改的样式属性，以对象的形式传递，必须写，属性名可以不用带引号，如果是复合属性则采取驼峰命名法fontSize
speed	可选	动画速度/时长   可用三种字符串 slow normal fast 或者数字500（单位：毫秒）
easing	可选	指定切换效果 默认 swing 可选 linear
fn	可选	回调函数 在动画完成时执行的函数 每个元素执行一次

动画队列和停止排队

动画或者效果一旦触发就会执行，如果多次触发，就造成多个动画或效果排队执行

停止排队：stop()

stop() 方法用于停止动画或效果 

注意：stop() 写到动画或者效果的前面，相当于结束上一次的动画

实例用法：

    $('ul li').hover(function () {

        $(this).siblings().stop().fadeTo(300,0.4)

    },function () {

        $('ul li').stop().fadeTo(300,1)

    })

如果不适用stop会出现的问题：鼠标已经不再移动 但排列的动画还在继续执行

加上stop 就会出现我们想要的效果