Модальный Bootstrap / Несколько модальных окон на одной странице / модально-открытый класс ⇐ CSS

[Anonymous]

У меня серьезная проблема с модальными окнами в Bootstrap.

Когда я открываю модальное окно на своем веб-сайте, проблем абсолютно нет (класс modal-open правильно добавлено на тело) модальное окно правильное, оттенок нормальный, содержимое ясное:

Код: Выделить всё

buttonOpenMe

Когда я закрываю его вручную, все тоже нормально:

Код: Выделить всё

×
CLOSE

В моем первом модальном окне у меня есть две другие кнопки для проверки моих предыдущих и следующих проектов (мой веб-сайт одностраничный).

И вот что я хочу сделать:

действие 1) открыть модальное окно №1

действие 2) прокрутить и нажать на следующий проект
действие 3) закрыть модальное окно №1

действие 4) открыть модальное окно №2 и т. д.

Код: Выделить всё

CloseThis

В моем теле был добавлен класс под названием «modal-open», когда модальное окно открывается. Но когда я уже нахожусь в первом модальном окне и хочу перейти во второй проект (модальное окно №2), он появляется, но мой прокрутка заблокирована, и мое тело потеряло свой класс «модально-открытый».

Я думаю, data-dismiss="modal" все прояснит. Но когда я добавляю вручную (с помощью инспектора) класс «modal-open» на свое тело, когда открывается второй модальный модуль, все работает.

Поэтому я попытался это исправить. с большим количеством решений из сообщений на форуме, и ничего на самом деле не работает.

Я думаю, мне пришлось искать фрагменты такого типа для автоматического добавления класса в тело, что-то вроде это :

Код: Выделить всё

    $(document)
.on('show.bs.modal', '.modal', function () {
$(document.body).addClass('modal-open')
})
.on('hidden.bs.modal', '.modal', function () {
$(document.body).removeClass('modal-open')
})

Но на самом деле, очевидно, всё не удалось!

Как я могу это исправить?

Если вы хотите взглянуть на мою тестовую онлайн-версию: http ://bg-portfolio.com/bg_test/index.php, прокрутите и нажмите на первый проект «Gamers Assembly 2017», затем прокрутите и нажмите «Projet suivant» (следующий проект). Ошибка появится!

PS: Я работаю с Bootstrap v3.3.7 (и когда я вставляю файлы новостей, все ломается, поэтому для этого сайта я просто хочу пока остаться на этой версии)

Подробнее здесь: https://stackoverflow.com/questions/454 ... open-class