jquery fancybox - предотвращать закрытие по клику за пределами fancybox - PullRequest
11 голосов
/ 01 сентября 2009

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

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

Я пытался hideOnContentClick: false, но это, похоже, не работает для меня. Есть идеи?

Ответы [ 15 ]

24 голосов
/ 28 мая 2012
   jQuery(".lightbox").fancybox({
        helpers     : {
            overlay : {
                speedIn  : 0,
                speedOut : 300,
                opacity  : 0.8,
                css      : {
                    cursor : 'default'
                },
                closeClick: false
            }
        },
    });
11 голосов
/ 17 июня 2011
<script type="text/javascript">
  $(document).ready(function() {
    $("#your_link").fancybox({
      'hideOnOverlayClick':false,
      'hideOnContentClick':false
    });
  });
</script>                              
7 голосов
/ 16 июня 2010

Я использую fancybox 1.3.1, если вы хотите заставить пользователя закрывать модальное окно ТОЛЬКО нажатием на кнопку, вы можете указать в конфигурации:

<script type="text/javascript">
  $(document).ready(function() {
    $("#your_link").fancybox({
      'hideOnOverlayClick':false,
      'hideOnContentClick':false
    });
  });
</script>
6 голосов
/ 22 октября 2014

Для этой проблемы, пожалуйста, попробуйте этот способ

$("YourElement").fancybox({
 helpers: {
        overlay: { closeClick: false } //Disable click outside event
    }

Надеюсь, это поможет.

5 голосов
/ 08 ноября 2012

Если вы используете Fancybox 1.2.6 (как я нахожусь в проекте), я обнаружил опцию hideOnOverlayClick. Вы можете установить его в false (например, hideOnOverlayClick: false).

Я нашел эту опцию, изучая возможность изменения кода на основе предложения Скотта Даудинга.

4 голосов
/ 01 сентября 2009

Вариантов для этого нет. Вам придется изменить исходный код.

В jquery.fancybox-1.2.1.js вам необходимо закомментировать (или удалить) строку 341 в методе _finish:

//$("#fancy_overlay, #fancy_close").bind("click", $.fn.fancybox.close);
3 голосов
/ 13 сентября 2012

Ничего из вышеперечисленного не помогло мне, поэтому я просто написал небольшую часть для последней версии fancybox.

function load(parameters) {
    $('.fancybox-outer').after('<a href="javascript:;" onclick="javascript:{parent.$.fancybox.close();}" class="fancybox-item fancybox-close" title="Close"></a>');
}

$(document).ready(function () {
    $(".various").fancybox({ 
        modal: true,
        afterLoad: load
    });
});

Надеюсь, это поможет:)

3 голосов
/ 06 апреля 2012

Я столкнулся с той же «проблемой». Это сработало для меня:

$("#fancybox-overlay").unbind();
2 голосов
/ 06 ноября 2013

Установите для параметра closeClick значение false внутри вашей функции:

$(".video").click(function() {
    $.fancybox({
        width: 640,
        height: 385,
        helpers: { 
            overlay: {
                closeClick: false
            }
        }
    });

    return false;
});
2 голосов
/ 21 сентября 2012

Решение $("#fancybox-overlay").unbind(), данное @Gabriel для этого вопроса, работает, за исключением того, что мне нужно было привязать его к fancybox после того, как он загрузит его содержимое, и я не смог немедленно отменить привязку. Для тех, кто сталкивается с этой проблемой, следующий код решил эту проблему для меня:

$('.fancybox').fancybox({'afterLoad' : function() {
    setTimeout(function() { $("#fancybox-overlay").unbind(); }, 400);}
});

Задержка 400 мс заставила меня работать. Он работал с 300 мс, но я не хотел рисковать.

...