Question

我正在使用jquery旋转木马，我在这里自动旋转图像（http://jsbin.com/unoce/2），所以我遇到的问题是左边的内容不是自动旋转“带”图像和箭头选择也不是。它仅在我单击左侧的内容时起作用，然后右侧的图像与箭头一起适当地移动。

有人可以提供支持，所以我可以将文字和箭头“自动”旋转图像吗？

下面这段代码只会旋转图片，而不是其他内容......

jQuery(document).ready(function() {
  jQuery("#features").jcarousel({
    scroll: 1,
    auto:2,
    wrap: 'both',
    initCallback: mycarousel_initCallback,
    buttonNextHTML: null,
    buttonPrevHTML: null
  });
});

这是一个演示，你也可以编辑这个演示： http://jsbin.com/unoce/2

谢谢，

埃文

Answer 1

看看这个：

http://jsbin.com/unoce/7/edit

您使用的是旧版本的jQuery（1.3.2）。当前是1.4.2，所以我在jsBin中切换它以使用谷歌的托管版本的jQuery。
这不是问题的一部分，但我整合了一些代码。你曾多次打电话给$(document).ready()。这不错，但也没有必要。我将代码整合到一个ready()调用中。
您分配了2个点击处理程序。再次，这很好，但不必要。我将两者的代码放入initCallback属性的回调中。
initCallback仅在开始时被调用一次。这就是current类在自动更新时没有得到更新的原因。

jCarousel有很多其他回调选项。一个叫itemVisibleInCallback。它实际上需要一个可以进行两次回调的对象：

itemVisibleInCallback: {
      // This one is called before new item is displayed
  onBeforeAnimation: mycarousel_itemVisibleBefore,

      // This one is called after new item is displayed
  onAfterAnimation: mycarousel_itemVisibleAfter
}

这就是我负责删除和添加current类的地方。

这些回调可以有四个参数：轮播，项目，idx，状态

我必须使用idx参数来引用#features-nav下的正确项目，因为item参数似乎是指正在滚动的项目。

无论如何，希望这有帮助。

jquery轮播自动滚动文本和图像

1 个答案: