Question

我正在制作一个带有视频库的网站。我正在使用视频库的智能网格插件。该插件允许在图像标题部分插入HTML代码。所以使用HTML和CSS，我添加了一个字体真棒图标和鼠标悬停在图像上时出现的外部链接。使用CSS我还在灯箱内放置了一个链接，该链接将用户带到前面提到的相同外部链接。现在，我的问题是灯箱内的链接工作正常。但是图像叠加层上显示的链接不起作用。相反，当我点击链接时，灯箱就会打开。

放置在第一张图片标题中的HTML代码：

<div class="show-in-gallery">
    Airbnb <br />
    <i class="fa fa-play" aria-hidden="true">
    </i>&nbsp;&nbsp;&nbsp;&nbsp;
    <a class="GalleryLink" href="http://cirkus.co.nz/?p=57">
        Read More
    </a>
</div>

<div class="show-in-lightbox">
    <a class="GalleryLink" href="http://cirkus.co.nz/?p=57">
        Read more
    </a>
</div>

CSS：

 .show-in-lightbox {
     display:none;
 }
 .pswp__caption .show-in-lightbox {
     display:block;
 }
 .pswp__caption .show-in-gallery{
     display:none;
 }
button{
    color:black;
}
.GalleryLink{
    color: white;
}

网站网址：https://robierobz.com/

图像叠加上的链接打开Lightbox而不是外部页面

0 个答案: