實現動畫「滑動面板」的最優雅方式

Question

我試圖實現與Aveda網站類似的動畫「滑動面板」效果。

我有點不知所措的所有選項和Javascript庫可用。在檢查Aveda網站代碼後有點困惑。

有關如何處理此任務的任何建議請？哪個Javascript /效果庫最適合？我對一個圖書館沒有任何忠誠或更大的經驗。

我的要求是：

• 簡單&優雅的實現（當然），跨瀏覽器的兼容性
• 不想重新發明輪子
• 能力動畫和通過鼠標點擊激活（如Aveda首頁）
• 動態（不想因添加更多'面板'而不得不修改javascript）

我的第一印象是使用Scriptaculous - Effect.Move，但我知道有現成的實現，如Spry's。

此Javascript新手將不勝感激任何智慧和建議的話。

Prembo。

Answer 1

我喜歡http://www.davidmassiani.com/horinaja/

它可以藏漢使用鼠標滾輪作爲鏈接窗格之間滾動，它的可script.aculo.us和jQuery。

我會推薦後者，因爲它很輕便易於學習/處理。

Answer 2

http://jqueryfordesigners.com/coda-slider-effect/是一個很好的使用jQuery的教程。

Answer 3

我喜歡Aveda實現這種效果的方式。他們正在使用原型/ scriptaculous，這是一個自定義的實現。

Aveda效應被稱爲旋轉木馬。 Aveda轉盤滾動到計時器上的下一個元素，並具有很好的非線性轉換。

+1 Deefjuh，我認爲Horinaja會做你想做的事情，並且最容易實現。

如果您想要更多的挑戰，我已使用PrototypeUI（http://www.prototype-ui.com/）傳送帶爲項目執行一系列輪播（例如http://teacher.scholastic.com/products/classmags.asp）但點指示符控件必須自定義編程。