如何在打开fancybox时启用父文档的滚动？

Question

我希望显示一个fancybox，但仍然可以在父页面上向上和向下滚动。

有办法吗？

我的Fancybox定义：

// Fancy box to appear when user scrolls below video
            $(".fancybox").fancybox({
                autoSize:false,
                modal:false,
                width:400,
                height:'auto',
            });

Answer 1

你需要设置CSS规则来覆盖fancybox的那些：

html.fancybox-lock, html.fancybox-lock body {
    overflow: visible !important;
}

html.fancybox-lock body .fancybox-overlay{
    overflow: hidden !important;
}

Answer 2

Fancybox在其API中提供该功能，无需覆盖任何CSS规则

只需在脚本中添加helpers选项，例如

jQuery(document).ready(function($) {
  $(".fancybox").fancybox({
    // API options
    helpers: {
      overlay: {
        locked: false // allows to scroll the parent page
      }
    }
  }); // fancybox
}); // ready

<强> DEMO