jQuery的动画效果--淡入淡出

jQuery是通过控制不透明度的变化来控制匹配到的元素的淡入淡出效果

fadeIn([speed] [fn]) 通过不透明度的变化来实现匹配到元素的淡入的效果;

fadeOut([speed] [fn])通过不透明度的变化来实现匹配到元素的淡出的效果;

fadeToggle([speed] [fn]) 通过不透明度的变化来开关所有匹配元素的淡入淡出效果;

fadeTo([speed] opacity [fn]) 把所有匹配到元素的不透明度以渐进发方式调整到指定的不透明度;

// speed:规定效果的时长

fn:动画完成时执行是函数

opacity：fadeTo()方法中必须参数，控制淡入淡出的效果的不透明度（值介于0与1之间）

$(document).ready(function () {

    $('.box1').hide()

    $('.btu1').click(function () {

        $('.box1').fadeIn(3000)

    })

    $('.btu2').click(function () {

        $('.box2').fadeOut()

    })

    $('.btu3').click(function () {

        $('.box3').fadeToggle(500)

    })

    $('.btu4').click(function () {

        $('.box4').fadeTo(1000, 0.3)

    })

})