<delect id="sj01t"></delect>
  1. <em id="sj01t"><label id="sj01t"></label></em>
  2. <div id="sj01t"></div>
    1. <em id="sj01t"></em>

            <div id="sj01t"></div>

            jQuery學習筆記之jQuery的動畫

            時間:2024-11-06 02:50:55 jQuery 我要投稿
            • 相關推薦

            關于jQuery學習筆記之jQuery的動畫

              一.系統預定義的動畫函數

            關于jQuery學習筆記之jQuery的動畫

              1.顯示隱藏函數

              show(); //顯示元素(同時增加寬、高、不透明度)

              hide(); //隱藏元素

              執行hide()隱藏界面元素,相當于將css樣式中的display:none.

              我們也可以在函數中加入參數,具體如下:

              show("slow");

              除了slow取值外,還可以設置為normal,fast,分別代表時間為600,400,200毫秒

              我們也可以加如具體時間取值。具體如下:

              slow(1000);

              這樣代表時間完全顯示出元素的時間間隔為1000毫秒

              2.不透明度函數

              fadeIn();//逐漸顯示元素(只增加不透明度)

              fadeOut();//逐漸隱退元素

              3.高寬度函數

              slideDown();//逐漸增加元素高度(只增加元素高度)

              slideUp();//逐漸縮短元素高度

              二.自定義動畫函數

              animate(params,speed,callback);

              params:取值為一個樣式屬性和取值的映射

              speed:速度

              callback:動畫完成時的執行函數

              其中params的樣式屬性取值可以是多個屬性,也可以是累增,累減的取值

              例子:

              復制代碼 代碼如下:

              $(function(){

              $(#id1).click(function(){

              $(this).animate({left:"+=500px",height:"200px"},3000,function(){

              $(this).css("border","5px solid blue")

              })

              })

              })

              1.停止元素動畫

              stop();

              結束當前執行的動畫,并立即執行下面定義的動畫

              2.判斷是否在動畫狀態

              is(":animate")

              3.其他動畫函數

              toggle(speed,callback);//立即切換元素狀態(高,寬,不透明度),如果隱藏則切換到顯示,如果顯示則切換的隱藏

              sildeToggle(speed,callback);//改變高度方式切換元素狀態

              fadeto(speed,opacity,callback);切換到指定的不透明度值

            【jQuery學習筆記之jQuery的動畫】相關文章:

            jQuery的DOM操作筆記07-29

            jQuery程序設計08-05

            jquery提交按鈕的代碼07-28

            淺析jQuery 遍歷函數javascript08-06

            jQuery中prev()方法用法07-16

            jQuery中replaceAll()方法用法10-15

            如何理解jquery事件冒泡09-15

            jquery之超簡單的div顯示和隱藏特效demo簡介05-15

            jQuery 源碼分析和Ready函數06-28

            jQuery中parent()和siblings()的問題10-16

            <delect id="sj01t"></delect>
            1. <em id="sj01t"><label id="sj01t"></label></em>
            2. <div id="sj01t"></div>
              1. <em id="sj01t"></em>

                      <div id="sj01t"></div>
                      黄色视频在线观看