实现动画“滑动面板”的最优雅方式

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）但点指示符控件必须自定义编程。