jQuery Cycle 插件不工作答案

【问题标题】：jQuery Cycle plugin not workingjQuery Cycle 插件不工作
【发布时间】：2013-07-24 02:05:09
【问题描述】：

有一个网站，其中有一个部分，我试图在 JSFiddle 中复制并使用它。

我遇到的一个问题是：

这两个小<- -> 按钮用于在推荐之间切换。此切换由jQuery Cycle Plugin 完成。

问题是我无法让这些按钮在 JSFiddle 中工作。

我导入了原网站使用的jquery.cycle.all.2.74.pack.js文件，还添加了jQuery。所以我不知道还缺少什么。

我的 JSFiddle 副本： http://jsfiddle.net/ahmadka/FsSxd/

原网站：http://bit.ly/16447fr（避免搜索引擎索引）

这是在原始网站上使用这些 <- -> 按钮的地方：

【问题讨论】：

我认为您从不调用 $('.div').cycle()，请在他们的网站上查看如何执行此操作的示例。抱歉，现在没有时间创建一个可以工作的 jsFiddle，希望对您有所帮助

【解决方案1】：

需要做一些事情才能使其正常运行。首先，你从来没有打电话给cycle()：

$('.scrollable4 .items').cycle({
  timeout: 0, 
  next: '.next',
  prev: '.prev',
  fx: 'scrollRight',
  easing:  'easeInOutBack' 
})

其次，要模仿您正在寻找的效果，您需要 easing.js 插件（请参阅下面链接的 jsfiddle 中的外部资源）。

最后，在您的 CSS 中，您不能浮动元素，它们需要绝对定位并指定 100% 的高度。

#divleftcontent2 .scrollable4 .items {
  position: absolute;
  height: 100%;
}

有other ways to fix the height issue，但这是一个不同的问题。

我已更新小提琴以显示我认为您正在寻找的最终版本：http://jsfiddle.net/FsSxd/8/

【讨论】：