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

Программисты Html
Ответить
Anonymous
 Модальный Bootstrap / Несколько модальных окон на одной странице / модально-открытый класс

Сообщение Anonymous »

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

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

buttonOpenMe

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

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

×
CLOSE

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

И вот что я хочу сделать:
  • открыть модальное окно#1
  • прокрутить и нажать на следующий проект
  • закрыть модальное окно#1
  • открыть модальное окно#2, и т. д...

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

CloseThis

В моем теле был добавлен класс под названием «modal-open», когда модальное окно открывается. Но когда я уже нахожусь в первом модальном окне и хочу перейти во второй проект (модальный №2), он появляется, но моя прокрутка заблокирована, и мое тело потеряло класс modal-open.
Я думаю, 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
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Html»