Fancybox: При нажатии любой части страницы Fancybox

Question

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

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

В настоящее время мой код не является следующее:

<script> 
     $(document).ready(function(){ 
      $(document).click(function(e){ 
      $.fancybox.open([{ 
       href: '/welcome', 
       title: 'Welcome to Our Website!' 
      }], 
      { 
       width: 800, 
       height: 600 
      }); 
      }); 
     }); 
</script> 

Для меня код хорошо, но когда я иду на эту страницу и нажмите на много частей страницы, ничего случается. Примечание. В консоли не отображаются сообщения об ошибках, поэтому, что я делаю неправильно?

Answer 1

Если вы хотите FancyBox открыть, когда пользователь щелкает в любом месте вашей страницы после загрузки страницы (и, прежде чем они могут взаимодействовать с самой страницы), то попробуйте

jQuery(document).ready(function ($) { 
    // add fancybox class to body on page load 
    $("body").addClass("fancyopen"); 
    // bind click to body 
    $(".fancyopen").on("click", function() { 
     $.fancybox([{ 
      href: "/yourpage.html", 
      title: "welcome to our website" 
     }], { 
      width: 300, 
      height: 200, 
      type: "iframe", 
      afterShow: function() { 
       $(".fancybox-wrap").on("click", function (event) { 
        event.stopPropagation(); // so you can click fancybox without calling it again 
       }); 
      }, 
      afterClose: function() { 
       $(".fancyopen").unbind("click").removeClass("fancyopen"); // now you can interact with the page 
      } 
     }); // fancybox 
    }); // on 
}); // ready 

См JSFIDDLE