Jquery 基本动画

　　1.三组基本的动画

　　显示：show 、隐藏hide、滑入：slideUp、滑出：slideDown、滑入滑出切换：slideTpggle、淡入：fadeIn、淡出：fadeOut、淡入淡出切换：fadeToggle

　　1.1show([speed],[callback])

　　　　可选：speed-动画的持续时间，可以是毫秒，还可以是固定的字符串

　　　　可选：callback-回调函数，动画结束后执行

　　show()；不传任何参数  直接显示      最常用

　　show(1000)；传入1000 动画会在1秒内全部完成

　　show(1000,function(){alert("动画执行完毕")});

<style>
    div{
        width: 300px;
        height: 300px;
        background: pink;
        display: none

    }
</style>
<body>
<div class="box">
   
</div>

<script>
    $(function(){
    //    $("div").show();         //直接显示div
    // $("div").show(1000);            //显示div会在1s内完成
    $("div").show(1000,function(){
        alert("动画执行完毕了");
    });            //显示div会在1s内完成  随后会提示你动画执行完毕了
    });
</script>
    
</body>

　　1.2hide（[speed]，[callback]）    和show方法一样的参数效果 

　　1.3 slideUp（隐藏）、slideDown（出现）和show方法一样的参数   （不传入参数的时候会默认为400ms     有滑动效果）slideToggle滑入滑出切换（效果一样的，只是会来回的切换）

　　1.4  fadeIn、fadeOut、fadeToggle：和slideUP...down一样的只是效果不一样。　　　　　　　

　　　　

　　

 

 

 

 

　　

posted @ 2019-04-03 15:22  WhiteSpace  阅读(276)  评论(0)  编辑  收藏  举报