最新的Web開發教程
 

jQuery效果 - 滑動


jQuery的滑動滑動方法元素上下。

點擊向下滑動/向上面板

因為時間非常寶貴,我們提供快速,方便的學習。

在w3ii,你可以學習你需要學習的一切,在方便和得心應手的格式。


例子

jQuery slideDown()
演示了jQuery slideDown()方法。

jQuery slideUp()
演示jQuery的slideUp()方法。

jQuery slideToggle()
演示了jQuery slideToggle()方法。


jQuery的滑動方法

用jQuery可以創建在元素的滑動效果。

jQuery有下面滑動的方法:

  • slideDown()
  • slideUp()
  • slideToggle()

jQuery的slideDown()方法

jQuery的slideDown()方法用來滑下的元件。

句法:

$(selector).slideDown(speed,callback);

可選的速度參數指定的效果的持續時間。 它可以採取以下值: "slow", "fast" ,或毫秒。

可選的回調參數是滑動完成之後將要執行的功能。

下面的例子演示slideDown()方法:

$("#flip").click(function(){
    $("#panel").slideDown();
});
試一試»

jQuery的slideUp()方法

jQuery的slideUp()方法用來向上滑動的元件。

句法:

$(selector).slideUp(speed,callback);

可選的速度參數指定的效果的持續時間。 它可以採取以下值: "slow", "fast" ,或毫秒。

可選的回調參數是滑動完成之後將要執行的功能。

下面的例子演示了slideUp()方法:

$("#flip").click(function(){
    $("#panel").slideUp();
});
試一試»

jQuery的slideToggle()方法

jQuery的slideToggle()方法之間切換slideDown()slideUp()方法。

如果這些元素已經下滑, slideToggle()將其向上滑動。

如果這些元素已經下滑了, slideToggle()將其滑下。

$(selector).slideToggle(speed,callback);

可選的速度參數可以採取以下值: "slow", "fast" ,單位為毫秒。

可選的回調參數是滑動完成之後將要執行的功能。

下面的例子演示slideToggle()方法:

$("#flip").click(function(){
    $("#panel").slideToggle();
});
試一試»

自測練習用!

練習1» 練習2» 練習3» 練習4»


jQuery效果參考

對於所有的jQuery效果的完整概述,請訪問我們的jQuery效果參考