2013-09-02 3 views
20

Перейдите на страницу this site, нажмите «Войти» в верхнем правом углу и вы увидите всплывающее окно с твитер-бутстрапом, но будет выделено серым цветом.Модифицированное окно Bootstrap неактивное

Почему это происходит?

+0

просят нас, чтобы посетить ваш сайт, это не очень хорошая практика, а позже, когда мы наткнулись на вопрос, как это нет никакого способа, мы можем увидеть этот вопрос вы должны были –

ответ

23

Это потому, что .navbar-fixed-top имеет индекс z 1030, тогда как модальный фон имеет индекс z 1040, заставляя модальное наложение навигационной панели.

Чтобы исправить это, просто установите значение z-index ниже 1030 - например.

.modal-backdrop { 
    z-index: 1020; 
} 
18

Прежде всего, добавить данных-фон = "ложных" к вашему модальной DIV

Затем добавьте следующую строку в ваш стиль:

.modal { background: rgba(000, 000, 000, 0.8); min-height:1000000px; } 

Не забудьте добавить кнопка закрытия в вашем модальном ...

<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 

Cheers ..

+0

Это работало в моем случае, когда я использовал самонастройки их селектор ... переключение на тему, а затем возврат к умолчанию приведет к тому, что модальная страница на моей странице будет недоступна. Теперь он корректно работает с data-backdrop = "false" – cb88

+2

Thanks; добавив 'data-backdrop =" false "' исправил его сразу. – Neil

+0

Спасибо, сэр. Моя проблема была только в IE, но это помогло мне хорошо. Мне нужно было установить z-index моего nav на -1, чтобы он лежал под ним. Приветствия. – kmehta

23

Вы также можете использовать:

.modal-backdrop.in { z-index: auto;} 
+2

это лучший ответ. – hellion

1

мне пришлось добавить важно, чтобы заставить его работать!.

.modal-backdrop { 
    z-index: 1020!important; 
} 
Смежные вопросы