Question

我想要两个.scrollable（）函数，并且有两个.navigator（）实例;

我的页面:(请参见底部的滚动）http://tinyurl.com/69r4bth

我的JS

<script type="text/javascript">
$(function() {
    $(".scrollable").scrollable({
        circular: true,
        easing: 'easeInOutQuad',
        speed: 700
    }).autoscroll({
        autoplay: true,
        interval: 4000
    }).navigator();
    $(".scrollabler").scrollable({ //"scrollabler - note with the r at end
        circular: true,
        easing: 'easeInOutQuad',
        speed: 700
    }).autoscroll({
        autoplay: true,
        interval: 4000
    }).navigator();
});
</script>

问题是按钮和滑块不适用于右侧的第二个卷轴。我希望能在1小时内快速解决截止日期！

Answer 1

也许这会奏效：

<script type="text/javascript">
$(function() {
    //changed line
    $(".scrollable,.scrollabler").scrollable({
        circular: true,
        easing: 'easeInOutQuad',
        speed: 700
    }).autoscroll({
        autoplay: true,
        interval: 4000
    }).navigator();
});
</script>

编辑：删除了同班建议

Answer 2

对于初学者，您收到了一个JavaScript错误：

i.position（）为空 [打破此错误] 0）返回b; if（！c.circular＆amp;＆amp; a＆lt; 0 || a＆gt; b.ge ...（b）.bind（d，c [d]）; b [d ] = function（h）{h＆amp;＆amp;

...指向jquery.tools.min.js

在HTML的底部，你有一些JavaScript（以使两个可滚动区域都可以工作，我推测），结束于：

$（“。scrollabler”）。scrollable（{circular：true}）。navigator（“＃navix”）;

不确定你想要实现的目标。

查看可滚动文档，它们对同一页面上的所有可滚动元素使用相同的类。如果你需要区分scrollabler和scrollable，只需使用不同的ID并做“你需要做的特殊事情：分开。

除此之外，对同一页面上的所有可滚动项目使用相同的类名。

http://flowplayer.org/tools/demos/scrollable/multiple-scrollables.html

Answer 3

您是否在DOM中的这些元素处于同一级别？

根据文件：

现在每个scrollable都使用默认选择器.next和.prev来查找导致返回多个元素的导航元素。我们如何知道哪个导航元素控制哪个可滚动？可以通过将每个可滚动及其导航动作包含在相互的包装元素中来解决该问题。

http://www.jquerytools.org/documentation/scrollable/

我没有尝试过，但是像这样设置元素可能会有效：

<div class='navi'>...navitems...</div>
<div class='scrollable'>
   <div class='pages'>
       ...scrollable items...
   </div>
</div>
<div class='wrapper'>
  <div class='navi'>...navitems...</div>
  <div class='scrollabler'>
     <div class='pages'>
       ...scrollable items...
     </div>
  </div>
</div>

如何为不同的div设置两个jquery函数？滚动（）;

3 个答案: