jQuery：向左滑動並向右滑動

我在jQuery中看到過slideUp和slideDown。左右滑動的功能/方式如何？jQuery：向左滑動並向右滑動

2010-03-09 Sarfraz

您可以簡單地做一個'animate（{width：0}）'，然後將它設置爲向右或向左，讓它看起來像向右或向左滑動。 – 2010-03-09 18:13:55

您可以在jQuery UI的附加效果做到這一點：See here for details

簡單的例子：

$(this).hide("slide", { direction: "left" }, 1000); 
$(this).show("slide", { direction: "left" }, 1000);

來源

2010-03-09 18:03:46

這似乎是依賴於**效果核心**，是不是有辦法實現這個沒有任何外部的東西？ – Sarfraz 2010-03-09 18:07:33

@Sarfraz - 不是我所知道的，那麼你就是在重新發明輪子......一個音符可能會有幫助，保持方向與隱藏/顯示相同，這是它來自或去的方向......它是相反的，它是相同的，但你已經習慣了它。 – 2010-03-09 18:08:32

@Sarfraz - 如果你願意，你可以嘗試和拉動你需要的部分，儘管如此，如果你沿着這條路線前進，請從這裏開始：http：//code.google.com/p/jquery-ui/source /browse/branches/dev/effects/ui/effects.slide.js?r=2454 – 2010-03-09 18:10:49

如果你不想要的東西臃腫像jQuery UI，盡我的自定義動畫：https://github.com/yckart/jquery-custom-animations

對你而言，blindLeftToggle和blindRightToggle是合適的選擇。

http://jsfiddle.net/ARTsinn/65QsU/

來源

2012-09-16 12:54:31 yckart

感謝這些令人敬畏的功能..我一直在尋找像這樣容易的事情。它就像一個魅力。 – 2013-09-16 14:48:44

當我想這樣做，控制檯說我 '未捕獲TypeError：對象[對象對象]沒有方法'blindLeftToggle'' – 2014-02-20 16:06:36

這不適用於我，沒有任何反應。 – 2014-11-15 06:21:57

你可以隨時使用jQuery添加一個類，.addClass或.toggleClass。然後，您可以將所有樣式保留在CSS中並排除腳本。

http://jsfiddle.net/B8L3x/1/

來源

2013-10-30 19:42:40 Davidicus

此代碼工作得很好。 $（文件）。就緒（函數（）{VAR 選項= {}; $（「＃C」）隱藏（）;（ $（「＃c」）。toggle（「slide」，options，500）; （「＃b」）。hide（）; }）; $（「＃b」）。click（funct ion（）{（「＃d」）。toggle（「slide」，options，500）; $（「＃c」）。隱藏（）; }）; }）; nav { float：left; max-width：300px; width：300px; margin-top：100px; } article { margin-top：100px; height：100px; } ＃c，＃d { padding：10px; 邊框：1px堅實的橄欖; margin-left：100px; margin-top：100px; background-color：blue;按鈕{ }邊框：2px純藍色; background-color：white; 顏色：黑色; padding：10px; } 喜寄存器1

寄存器2

<article id="c"> 
     <form> 
      <label>User name:</label> 
      <input type="text" name="123" value="something"/> 
      <br> 
      <br> 
      <label>Password:</label> 
      <input type="text" name="456" value="something"/> 
     </form> 
    </article> 
    <article id="d"> 
     <p>Hi</p> 
    </article> 
</body>

參考erence：W3schools.com和jqueryui.com

注意：這是一個示例代碼不要忘記添加所有腳本標記以實現代碼的正常運行。

來源

2017-05-14 14:46:51 Sivalakshmi

jQuery：向左滑動並向右滑動

回答

相關問題