zoukankan      html  css  js  c++  java
  • 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{
             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一样的只是效果不一样。       

        

      

      

  • 相关阅读:
    基于java容器注解---基于泛型的自动装配
    mininet+floodlight搭建sdn环境并创建简单topo
    Bean装配之@Autowired注解
    Linux常用命令
    Bean利用Resource接口获取资源的几种方式
    MYSQL分页优化查询
    MYSQL统计和识别重复值
    MYSQL统计和识别重复值
    MYSQL处理数据重复值
    MYSQL处理数据重复值
  • 原文地址:https://www.cnblogs.com/xiaowie/p/10649093.html
Copyright © 2011-2022 走看看