0

我有循环运行幻灯片，当幻灯片悬停时，会出现上一个/下一个图形。该循环还有一个垂直缩略图寻呼机。我将寻呼机包装在定制版本的 jCarousellite 中，它在活动缩略图上放置了一个 .activeSlide 类，并拥有自己的一组 prev/next 链接。

总而言之，它工作得很好，可以在这里看到：

http://www.spiritlevel.co.uk/cycletest/cycle_test.html

但是，我还有最后一个障碍...

当单击幻灯片上的上一个/下一个图形时，我想检查新的 .activeSlide 是否在轮播中可见，如果没有，请这样做......我真的可以提供一些帮助。

举个例子，当你点击我上面的链接时，你会看到轮播中有 8 个缩略图。缩略图 1 处于活动状态。如果我单击幻灯片上的下一个图形，缩略图 2 将变为活动状态。再次单击，缩略图 3 变为活动状态等。一切都很好，直到我第 8 次单击并且缩略图 9 变为活动状态 - 然后问题是缩略图 9 在轮播中不可见 - 所以此时我想要一些代码激活这将触发轮播并使缩略图 9 可见。（在这种情况下触发轮播上的下一个链接将起作用）

该解决方案还需要处理页面加载和用户立即单击幻灯片上的上一张图片（显示最后一张幻灯片）等情况。触发轮播上的上一个链接在这里不起作用 - 而是必须多次触发下一个链接才能使活动缩略图可见。

我希望我已经清楚了——实际上很难解释我想要发生的事情，但我认为当你点击我上面的链接时会很明显——看比描述更容易！

我真的很想让这最后一点工作，并感谢您提供的任何帮助。

谢谢

4

1 回答 1

2

也许...

// When clicking the cycle arrows
$('#slidecontrol a').click(function () {
    var activeSlide = $('div.jcarousellite li.activeSlide');

    // If the "activeSlide" in the jcarousel is not already visible
    if (!activeSlide.is(':visible')) {
        // If there are items ABOVE the active slide that are visible we need to go down
        if (activeSlide.prevAll('li:visible').length) {
            var clicker = $('div.nextlite').find('a');
        }
        // Else we need to go up
        else {
            var clicker = $('div.prevlite').find('a');
        }

        // Keep clicking untill it's visible
        while (!activeSlide.is(':visible')) {
            clicker.click();
        }
    }
});
于 2012-02-21T14:10:13.520 回答