Как заполнить весь экран с Zurb Modal

Я использую Foundation 5 модальность и хотел бы регулировать модальность в небольшой & среднего экрана, чтобы быть таким, чтобы:Как заполнить весь экран с Zurb Modal

Он заполняет весь экран
Когда я прокрутите вниз в модальном, фоновое тело (исходная страница) не прокрутит вниз. Итак, как только я дойду до нижней части модального, он перестанет прокручиваться.

Я использую след до основания именно

<a href="#" data-reveal-id="myModal">Click Me For A Modal</a> 

<div id="myModal" class="reveal-modal" data-reveal aria-labelledby="modalTitle" aria-hidden="true" role="dialog"> 
    <h2 id="modalTitle">Awesome. I have it.</h2> 
    <p class="lead">Your couch. It is mine.</p> 
    <p>I'm a cool paragraph that lives inside of an even cooler modal. Wins!</p> 
    <a class="close-reveal-modal" aria-label="Close">&#215;</a> 
</div>

источник

2016-07-24 Husanoo

Вы можете играть с Chrome DevTools и настроить различные стили для достижения этой цели.

Для этого вам нужно:!

изменение ширины до 100% и добавить важно это
высота изменения до 100% и добавить важно к нему
комплект сверху 0 и add! important to important

Удачи.

источник

2016-07-24 18:14:18

Спасибо. Это позволяет заполнить весь экран. Но, я все еще могу прокрутить страницу, пока модальная открыта. Как отключить прокрутку страницы? – Husanoo

Это может иметь смысл. В теге тела у меня есть div для модального. Как только я открываю модальный, он меняет свой класс на class = "open-modal open". – Husanoo

Загрузил ваш код в jsFiddle. Я использовал документы Foundation 5, и он отлично работает, я не могу прокручивать страницу. –

Как заполнить весь экран с Zurb Modal

ответ

Смежные вопросы