Question

jQuery Scrollable（使用导航器插件）在首次加载时显示错误的幻灯片。

当我像这样使用它时它表现正常：

$(".scrollable").scrollable({}).navigator();

...但是一旦启用'循环'模式（允许从最终幻灯片循环回到第一个）：

$(".scrollable").scrollable({ circular: true }).navigator();

在页面加载时， final 项目是第一个一个节目，即使导航器中突出显示了第1项。如果您浏览图像，当您到达最后一个图像时，它会再次显示，并且您只能在第二个循环的开头看到实际的第一个图像。

有什么建议吗？

这是我的HTML完整性：

<div class="column two-thirds scrollable" id="scrollable">

<a class="prev browse left">Previous</a>

<div class="items">
        <div><img src="1.jpg" alt="" /></div>
        <div><img src="2.jpg" alt="" /></div>
        <div><img src="3.jpg" alt="" /></div>
        <div><img src="4.jpg" alt="" /></div>
</div>

<a class="next browse right">Next</a>

<div class="naviWrapper">
 <div class="navi"></div>
</div>

</div>

Answer 1

以下是指向同一问题的链接，建议您将<img>代码替换为带有背景图片的<div>代码。 https://github.com/jquerytools/jquerytools/issues/47

我不能这样做，因为我的一些图像有图像地图。但是，我的所有图像都具有相同的尺寸，所以我放入了图像尺寸，即

<img width=730 height=360 alt="first image" src="/images/my-image.jpg" />

这似乎解决了它。

jQueryTools Scrollable - 以循环模式跳转到最后一个图像

1 个答案: