Выполнять код JQuery каждый раз, когда карусель изображения попадает на определенное изображение в Bootstrap

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
        }
    });
});