好的,所以我认为需要几分钟才能实现的东西现在已经占用了我一个多小时的时间,我只是完全感到困惑。
我下载了lightbox2,按照说明;将它们的CSS和JS嵌入到我的index.html头中
<link href="lightbox/lightbox.css" rel="stylesheet">
<script src="lightbox/lightbox-plus-jquery.js"></script>我只是在本地主机上测试它,如果这有任何不同。路径设置正确100%,CSS所需的4幅图像的路径也是如此。
现在,在我的体内,我使用的是带有data-lightbox属性的am,如下所示
<a class="example-image-link" href="gallery/i1.jpg" data-lightbox="group" data-title="Optional caption.">
<img class="example-image" src="gallery/i1.jpg" alt="desc">
</a>
<a class="example-image-link" href="gallery/i2.jpg" data-lightbox="group" data-title="Optional caption.">
<img class="example-image" src="gallery/i2.jpg" alt="desc">
</a>页面上没有其他内容,因此结果如下:

的问题是,当我单击其中一个图像时,图像不是弹出的灯箱,而是在一个全屏选项卡中打开的。,就像灯箱根本不工作一样,它只是跟随a href到图像。我甚至尝试了JSFiddle,并加载了与外部资源相同的CSS和JS,而且它也在做同样的事情。你自己去看看-> JSFIDDLE
我愿意接受任何想法。真的不明白我错过了什么。
发布于 2015-10-14 09:01:52
您应该将<script src="lightbox/lightbox-plus-jquery.js"></script>位移动到body标记的末尾,而不是head。问题是,如果脚本在头上,它将在图像准备好由库解析之前运行。
https://stackoverflow.com/questions/33120704
复制相似问题