Question

我有一个图像转盘，其中三个旋转的背景图像是在Bootstrap的转盘类的帮助下制作的。在轮播的其中一个页面中，我有一个显示报价的框。我希望每次图像轮播再次落入该页面时，报价都会发生变化。什么是使用JQuery做到这一点的好方法？特别是，由于我对轮播类的内部工作了解有限，因此我不确定我现在可以使用哪个属性来告诉哪个页面处于活动状态。

编辑：明确一点，我不需要随机引号或任何东西的实现。只要轮播在某个页面上停留，我只需要知道如何做（例如更改文本）即可。

Answer 1

好的，我自己也有答案。不过，不确定这是否是最好的方法。轮播每次滑动都会触发一个事件。听它并增加一个计数器。以计数器为模数的轮播页面。如果为零，则执行操作。这样，每次轮播滑动足够多次以再次降落在第一页上时，您都将执行操作。我认为，如果用户使用轮播指示器跳过页面，则该事件不会触发两次。无论如何，对于我来说，这种解决方案已经足够了。

如果要在第二页或第三页上执行某些操作，只需将0中的counter % 3 == 0更改为1或2。

$(function () {
    $("#carouselIndicators").on("slid.bs.carousel", function () {
        counter++;
        if (counter % 3 == 0) {
            //do stuff
        }
    });
});

每当图像轮播落在Bootstrap中的某个图像上时，都要执行JQuery代码

1 个答案: