• jQuery-淡入淡出效果-fadeIn()淡进 fadeOut()淡出 fadeToggle();


    动画
    高级函数:基于底层函数又进行了封装
    两大块:简化版的动画函数和万能动画函数
    简化版动画函数
    显示/隐藏$().show;  $(...).hide();
      强调:无参数的show()/hide()使用的是display属性
     瞬间隐藏和显示
     动画参数:speed:
     2种:1.三档: fast normal slow  慢中快 
                2.用毫秒数自定义
    动画的速度变化:参数:easing:linear线性变化 swing摇摆属性先加速后减速

    伸缩/折叠slideUp向上   slideDown向下  slideTogger()切换

    淡入/淡出:fadeIn()淡进   fadeOut()淡出   fadeToggle();

     1 <!DOCTYPE html>
     2 <html>
     3 <head lang="en">
     4     <meta charset="UTF-8">
     5     <title></title>
     6 </head>
     7 <body>
     8 <h1>jQuery动画函数-显示隐藏动画</h1>
     9 <button id="bt1">隐藏DIV</button>
    10 <!--div#target>p>lorem+Tab键-->
    11 <div id="target">
    12     <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium autem dicta doloribus eius fugit illum
    13         ipsum, itaque laborum laudantium modi necessitatibus, nulla, numquam odio qui quisquam sequi temporibus tenetur
    14         veniam?</p>
    15 </div>
    16 <script src="javascript/jquery-1.11.3.js"></script>
    17 <script>
    18     //为id为bt1的按钮绑定单击事件:
    19     $("#bt1").click(function(){
    20         $("#target").fadeToggle(500);
    21         //toggle切换隐藏/显示效果
    22     });
    23     //让id为target的div隐藏
    24 </script>
    25 </body>
    26 </html>
  • 相关阅读:
    POJ 2352 &amp;&amp; HDU 1541 Stars (树状数组)
    SSH三大框架的工作原理及流程
    稀疏表示
    Linux程序设计学习笔记----多线程编程线程同步机制之相互排斥量(锁)与读写锁
    [面经] 南京SAP面试(上)
    JAVA数组的定义及用法
    花指令
    计算机认证考试种类
    《C语言编写 学生成绩管理系统》
    spice for openstack
  • 原文地址:https://www.cnblogs.com/longly/p/6396067.html
Copyright © 2020-2023  润新知