从 div 触发花式框？

Question

我见过这个问题的几种不同变体，但似乎都没有帮助。我只是想从 div 触发 fancybox。我有一个 div:

<div class="port web">Website</div>

这个div有一定的css特点：

  .web{
    font-size: 80px;
    color: rgba(255,0,0,.8);
    font-family: 'Luckiest Guy', cursive;
}

我正在寻找一种方法来单击 .web 打开一个精美的盒子。我是一个业余爱好者，我试图将 div 放入 fancybox 锚中，我认为这是一个菜鸟错误。如果有帮助，我对 jquery 有一些了解。谢谢

 <a class="fancybox" rel="group" href="image/bg.jpg"><div class="port web">Website</div><img src="small_image_1.jpg" alt=""></a>



 $(document) .ready(function(){

         $('.web').animate({left:'12.5em', top:'6.5em'}, 3500);
    });

Answer 1

为什么不直接将 fancybox class 和 href 添加到 div 元素中：

<div class="fancybox port web" href="image/bg.jpg">Website</div>

触发元素是锚点还是 div 或其他什么都没有关系。如果您要使用 v3，那么您只需添加 data-fancybox 和 data-src 属性，它就可以在不编写任何 JS 行的情况下工作。

从 div 触发花式框？

trigger fancy box from div?

html

css

jquery

fancybox