jQuery第四课 ——运动

1.同时改变的是宽高透明度
    show() 显示
    hide() 隐藏
    toggle() 切换显示 / 隐藏的状态

    2、改变的是高
    slideDown()  向下滑动展开
    slideUp()  向上卷动隐藏
    slideToggle()  以滑动/卷动方式切换 展开 / 收起状态

    3、改变的是透明度
    fadeIn()  淡入方式显示
    fadeOut() 淡出方式消失
    fadeTo()  淡入或淡出到某个透明度

    共同点 :参数1, :表示完成时间,默认是normal(代表400ms),fast(代表200ms),slow(代表600ms),也可自定义,fadeIn(500)
            参数2 : 一个回调函数
    上面三种实质内部都调用了animate


    4、animate();
    参数 : prop,speed,easing,callback 

    可用于animate()方法的常用属性 :opacity,top,height,width,margin,padding

    eg:$('#div').animate({ width : 400, height : 400 },500,liner,callback); 
    数值的运算还可以 {width : '+=100'};

    另一种写法:
    $('#div').animate({width : 400},{
        duration : 1000,
        easing : 'liner',
        complete : function(){},
        step : function(a,b) {
            //a : 表示div的width从开始到400的一个过程
            //b : 一个对象
        }
    })

    5、队列 :即一行行的设置(存在一个数组中),一行行的执行,从上往下

    6、delay()  延迟执行

    7、判断元素是否处于动画状态 :is(':animate')  ,返回true/false

    8、stop() 、finish()   停止运动
    stop() 默认:只停止当前的运动,并不会停止后续运动,
            加上一个参数(true)即停止全部,
            加上两个参数(truetrue)即当前运动的属性停止到目标点,

    finish() 停止所有运动并到达目标点

    ****stop(true)阻止animate()重复执行
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章