php - Fancybox:使用背景图片

Question

我在使用照片部分的 fancybox 时遇到了一些麻烦。

当您点击其中一张图片时，它会加载与页面上相同的大小(图片实际上要大得多)并且还会从页面中删除 div。

我想将 div 的背景图片以全尺寸加载到 fancybox 中。

<div class="main-photo fancybox" rel="group" style="background-image:url('<?php echo $photo; ?>');">
   <a href="<?php echo the_sub_field('photo'); ?>">
      <img src="<?php bloginfo('stylesheet_directory'); ?>/images/picture-of-health-photo-frame.png" height="240" width="360" />
   </a>
</div>

链接中的 img 实际上是相框，我不想将其包含在 fancybox 中。

Answer 1

你需要设置class="fancybox"到主播<a>标记，而不是 <div>标记为:

<div class="main-photo" rel="group" style="background-image:url('<?php echo $photo; ?>');">
   <a class="fancybox" href="<?php echo the_sub_field('photo'); ?>">
      <img src="<?php bloginfo('stylesheet_directory'); ?>/images/picture-of-health-photo-frame.png" height="240" width="360" />
   </a>
</div>