предотвратить пузыри скролл от элемента к окну - PullRequest
54 голосов
/ 22 сентября 2009

У меня есть окно модального окна (всплывающее окно), которое содержит iframe,
и внутри этого iframe есть div , который можно прокручивать.

Когда я прокручиваю внутренний DIV iframe, и он достигает своего верхнего или нижнего предела,
окно самого браузера начинает прокручиваться. это нежелательное поведение .

Я пробовал что-то вроде этого, что убивает прокрутку главного окна, когда
onMouseEnter, когда мышь входит в область всплывающего окна:

e.preventDefault () не работает должным образом по некоторым причинам ...

$("#popup").mouseenter(function(){
   $(window).bind("scroll", function(e){
        e.preventDefault();
   }); 
}).mouseleave(function(){
    $(window).unbind("scroll");
});

Обновление

Похоже, что сейчас в 2013 году e.preventDefault(); достаточно ...

Ответы [ 14 ]

0 голосов
/ 14 декабря 2014

Вот что я делаю:

  $('.noscroll').on('DOMMouseScroll mousewheel', function(ev) {
     var prevent = function() {
         ev.stopPropagation();
         ev.preventDefault();
         ev.returnValue = false;
         return false;
     }
     return prevent();
  }); 

демонстрационная скрипка

Используйте CSS overflow:hidden, чтобы скрыть полосу прокрутки, поскольку это ничего не изменит, если они ее перетащат.

Работает кросс-браузер

0 голосов
/ 22 сентября 2009

вы можете попробовать jscroll pane внутри iframe, чтобы заменить прокрутку по умолчанию.

http://www.kelvinluck.com/assets/jquery/jScrollPane/jScrollPane.html

Я не уверен, но попробуйте

0 голосов
/ 22 сентября 2009

Очевидно, вы можете установить overflow:hidden для предотвращения прокрутки . Не уверен, как это будет, если документ уже прокручен. Я тоже на ноутбуке без мыши, так что сегодня вечером мне не нужно тестировать колесо прокрутки :-) Хотя, наверное, стоит попробовать.

0 голосов
/ 22 сентября 2009
function stopPropogation(e)
{
    e = e || window.event;
    e.cancelBubble = true;
    if (e.stopPropagation) e.stopPropagation();
    if (e.preventDefault) e.preventDefault();
}

Это должно работать.

...