Запрет скролла под попап окном Скрол попап как в Пинтерест?

Question

[Чёкатилло]

В пинтерест пример https://ru.pinterest.com/pin/300967187582288257/
попап скроллица целиком, а скроллбар окна отображается, как общий для окна браузера (как обычно), а не в самом попап
При этом основная страница не скроллица

Я уж думал, попап растянуть на весь экран..тем самым доступ к скроллу основной стр. закрыть, а попап контент поместить в еще один див, дабы именно контент скроллился, но чет пока не выходит
Подскажите плиз)

Comments

[OVK2015]

Вроде вы раньше планировали этот пост в LightBox завернуть. Или что-то путаю? Не знаю как LightBox отнесется к контенту, отличному от картинки. Если плохо есть альтернатива www.fancyapps.com/. Отменяет скролл на всем что под ним.
+ Вот так можно эмулировать скролл содержимого самого popup fancyapps, если курсор находится вне его.

function scrollEmulator(event)
    {
      if(isPopupShow)
      {
        var scrollAmount = event.originalEvent.wheelDeltaY;
        scrollAmount = scrollAmount > 0 ? 0 - scrollAmount : Math.abs(scrollAmount);
        $('.fancybox-inner').scrollTop($('.fancybox-inner').scrollTop() + scrollAmount);
      }
    }

Answer 1

[420873535]

vodkabears.github.io/remodal

Answer 2

[Андрей Верх]

на body вешается класс c overflow:hidden;height:100vh;

Comments

[Чёкатилло]

Понял А как это сделать при открытом попап?

[Даша Циклаури]

в сафари приходится еще задавать position: fixed иначе все равно скроллится, при задании fixed позиция слетает, как быть?

[Денис Букреев]

Даша Циклаури: запоминать offsetTop и устанавливать обратно

[Kovalsky]

Денис Букреев: Даша Циклаури: бтв, так делает фейсбук

[Чёкатилло]

Даша Циклаури: Дарья, Вас тоже интересует сие вопрос? Не нашли ли ответ? )

[Чёкатилло]

Ну может скрипт какой поможет?

[Андрей Верх]

dimsemenov.com/plugins/magnific-popup
arcticlab.ru/arcticmodal

[Даша Циклаури]

Денис Букреев: сейчас так и делаю

[Денис Букреев]

Даша Циклаури: успешно?

[Даша Циклаури]

Денис Букреев: выглядит как костыль, то есть на оверлее в попап видно что фон сместился на верх страницы, это всё еще на ангуляр 2)))

Answer 3

[Dark Hole]

Самый простой вариант - вешать preventDefault на все, что может вызвать скролл. Но scroll bar все равно будет активен