Question

我正在尝试使用Shadowbox插件（http://www.shadowbox-js.com）创建一个图库。
因此我在创建图库时遇到了问题，问题是：每当我点击显示图像的链接（实际上是缩略图）时，它就开始加载，然后没有图像只显示黑色窗口。
我使用的链接：

<a href="http://localhost/myProject/images/10.jpg" rel="shadowbox"><img src="http://localhost/myProject/thumbnails/10.jpg" class="thumbnails"/></a>

脚本/ link / init：
这些导入正在运行，我通过使用（在Chrome中）Inspect element-＆gt; Network。验证它。

<link rel="stylesheet" type="text/css" href="shadowbox/shadowbox.css">
<script type="text/javascript" src="shadowbox/shadowbox.js"></script> 
<script type="text/javascript">
        Shadowbox.init();
</script>

备注：
1 - 我使用Shadowbox作为jQuery插件（非独立） 2-jQuery使用Google（非本地）导入我的网站 3 - 实际图像尺寸为3000x2400 编辑：
4-我意识到当右键单击 - >检查元素（在chrome中）时，图像会显示（但不是以正确的方式显示，只显示了一半）。
5 - 将handleOversize设置为drag时，会显示图像（必须单击） 6-它在IE 9中工作！

Answer 1

您是说图片在浏览器中无法正常显示？

这可能意味着该文件已损坏。尝试重新保存它。

我现在已经使用Shadowbox很长时间了，类似的问题总是由错误的文件引起，或文件权限没有正确设置。

Answer 2

由于您提供的是本地主机的示例，我只能提供一般性指导，而不是确切地告诉您问题所在。肯定会受到欢迎。

首先，确保在调用shadowbox.js文件之前调用 jQuery 。

除此之外，我确信你已经为网页提供了一个有效的!DOCTYPE，这使得你的Shadowbox标记正确到目前为止我已经看到了。

问题可能在于使用 jQuery 和您的班级名称thumbnails。

如果 jQuery 修改了具有特定样式的链接，Shadowbox可能会受到其锚标记的任何更改。

然后，这些更改将导致每个链接元素的Shadowbox看不到原始链接，因为它现在是一个jQuery链接。它需要由Shadowbox重新缓存。

解决方案：在完成对Shadowbox.init的任何修改后尝试调用thumbnail，以便Shadowbox缓存链接一次，或者如果需要，使用Shadowbox API .clearCache();和{{1重新缓存那些.setup();锚点。

我还应该提一下，你应该确保Shadowbox有一个jQuery Adapter接口，它是一个下载选项或WordPress插件选项。

Answer 3

我找到了解决方案，它不在DOCTYPE或浏览器中，甚至不在我的JS代码中！问题发生在CSS 将direction设置为right to left(rtl)（是的，网站是阿拉伯语）也许，因为图像正确而我无法看到，导致图像被隐藏。

Answer 4

这是一个老问题，但没有人正确回答这个问题。解决方案在这里：只需用shadowbox.css中的“left”将“left”值替换为“right”和“right”值

Answer 5

打开shadowbox.css并为direction:ltr r

设置#sb-containe

Shadowbox（图片库插件）仅显示黑色窗口

5 个答案: