在turnjs _s区域触发fancybox

Question

我在写一本数字杂志。差不多完成了，除了最后一部分。TurnJS具有这个区域功能，您可以在图像上定义一个可点击的区域，并执行转到URL或转到特定页面等操作。目标是触发包含youtube视频的fancybox。

这是我到目前为止所知道的：

12-regions.json：

[{
    "x":20,
    "y":95,
    "width":126,
    "height":50,
    "class":"link",
    "data":
        {
            "url": "https://www.youtube.com/embed/c5vtcm4hRGs?autoplay=1"
        }
}
]

Fancybox触发器：

 $( '.magazine .p12' ).on( 'click', 'div.region.link', function () { 
            $('.region.link').fancybox({
                openEffect  : 'none',
                closeEffect : 'none',
                helpers : {
                    media : {}
                }
            });
        });

它看起来是这样的：

​

​

Fancybox应该在点击“观看独家视频”时被调用。

以下是turnjs的generated region元素：

<div class="region  link" region-data="url=https%3A%2F%2Fwww.youtube.com%2Fembed%2Fc5vtcm4hRGs%3Fautoplay%3D1" style="top: 16%; left: 4%; width: 27%; height: 8%;"></div>

我能错过什么呢？每当我点击上述区域时，它只会打开一个新的标签并在那里加载视频。

希望你能帮我解决这个问题。提前感谢！

Answer 1

通过执行$( something ).fancybox()，您只需在该元素上附加一个单击事件，而fancybox将仅在下一次单击时启动。

如果您希望立即启动fancybox，那么您必须使用$.fancybox.open( .. )，有关更多示例，请参阅文档。