Почему в этой демоверсии Bootstrap 3.0 Modal появляется вторая вертикальная полоса прокрутки?
Прокрутите немного вниз по этой странице Bootstrap 3.0 (WIP) до "Модем запуска запуска".
http://bs3.codersgrid.com/javascript/#modals
Обратите внимание, что появляется вторая вертикальная полоса прокрутки. Почему?
Ответы
Ответ 1
Из-за стиля CSS, применяемого к элементу:
.modal {
bottom: 0;
display: none;
left: 0;
overflow-x: auto;
overflow-y: scroll; /* <--- this guy right here */
position: fixed;
right: 0;
top: 0;
z-index: 1040;
}
Явная установка свойства переполнения на scroll
приведет к тому, что браузер отобразит полосу прокрутки, есть ли переполнение или нет.
Ответ 2
Полностью удалите тег html из вашей таблицы стилей. Это исправит это.
Ответ 3
/*remove double scrollbar*/
body.modal-open { overflow: hidden!important; }
Ответ 4
Я пробовал каждый пример, который я нашел из stackoverflow и, наконец, это мое решение:
$(function(){
$(document.body).on("show.bs.modal", function () {
$(window.document).find("html").addClass("modal-open");
$(window.document).find("div.wrapper").css({"margin-right":"17px"});
});
$(document.body).on("hide.bs.modal", function () {
$(window.document).find("html").removeClass("modal-open");
$(window.document).find("div.wrapper").removeAttr("style");
});
});
$(function(){
$(document.body).on("show.bs.modal", function () {
$(document.body).addClass("modal-open");
});
$(document.body).on("hide.bs.modal", function () {
$(document.body).removeClass("modal-open");
});
});