fancybox - как прокрутить страницу, когда fancybox сфокусирован

Question

перейти к: http://fancybox.net/ открыть любой пример (на нижней странице)

когда мышь находится над содержимым внутри fancybox, прокручивать главное окно браузера невозможно. когда мышь где-то еще, она работает. я не хочу такого поведения. как бы это исправить?

страница под модальной прокруткой doenst, когда курсор мыши находится внутри fancyboxmodal.

Answer 1

Что ж, самое простое решение - добавить $ ('# fancybox-wrap'). Unbind ('mousewheel.fb');сразу после инициализации .fancybox ().

Answer 2

Действительно, бит кода, упомянутый Робом, является виновником.Но вместо того, чтобы изменить саму fancybox, вы можете сделать что-то вроде этого:

$('#fancybox-outer').mousewheel(function(event, delta) { 
  event.stopPropagation();
  $('#fancybox-wrap').trigger('mousewheel.fb', delta);
});

Это бы перехватило событие wheel на #fancybox-outer и предотвратило бы всплытие события до #fancybox-wrap.

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

Answer 3

Просмотрите исходный код Fancybox и замените код, отмеченный if ($.fn.mousewheel) {...}, следующим (Полностью измененный код можно найти здесь ).

    if ($.fn.mousewheel) {
        wrap.bind('mousewheel.fb', function(e, delta) {
            if (!busy && $(e.target).get(0).clientHeight == 0 || $(e.target).get(0).scrollHeight === $(e.target).get(0).clientHeight) {
                // Remove the next line too, if you want weird movements
                // at the image gallery example...
                e.preventDefault();
                $.fancybox[ delta > 0 ? 'prev' : 'next']();
            }
        });
    }

Создатели Fancybox отключили прокрутку элементов Fancybox, не добавив опцию для ее настройки. Следовательно, вы должны вручную отредактировать код.

Answer 4

В опциях fancybox вы можете сделать:

onComplete: function(){
  $("#fancybox-wrap").unbind('mousewheel.fb');
}

и затем вы можете сделать прокрутку мышью в любом поле с переполнением

Answer 5

Если вам не нужна возможность прокручивать изображения в галерее с помощью колесика мыши, то хорошим решением будет добавить $('#fancybox-wrap').unbind('mousewheel.fb'); сразу после .fancybox() инициализации, как указано vbulant

Answer 6

Марсель,

Не усложняйся.Вам совсем не нужно связываться с файлом fancybox js.Функция, упомянутая выше, имеет цель.

Причина, по которой страница ведет себя так, как вы описали, заключается в том, что она загрузила плагин jQuery mousewheel , который используется для навигации по галереям внутри fancybox с помощью колесика мыши.

Если вы не загрузите плагин mousewheel (входит в комплект загрузки fancybox), вы можете прокрутить родительскую страницу независимо от того, наведете ли вы курсор на содержимое fancybox илине.Конечно, если у вас есть галереи, то вы должны использовать стрелки для навигации по ним.

Answer 7

для fancyBox - версия плагина jQuery: 2.1.5

'afterShow': function () {
    $(".fancybox-wrap").unbind('mousewheel.fb');
},

'onComplete' не работает !!!

Answer 8

Добавьте следующее в параметры плагина:

helpers:  {
    overlay: {
      locked: false
    }
}

Спасибо pheonix за указание на https://stackoverflow.com/a/14880963/1655981