卡比尔的解决方案是正确的。我的图片URL 是
/images/ads/homepage/small-banners01.png,
这让 AdBlock 绊倒了。这对我来说不是跨域问题,它在 localhost 和 web 上都失败了。
我使用 Chrome 的网络选项卡进行调试,发现这些无法加载的特定图像的结果非常令人困惑。第一个请求将不返回任何响应(状态“(待处理)”)。后来,有第二个请求列出了原始 URL,然后“重定向”作为发起者。重定向请求标头都是针对这一相同的 base64 编码数据的短行,并且每个都没有返回响应,尽管状态是“成功”:
GET data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAACklEQVR4nGMAAQAABQABDQottAAAAABJRU5ErkJggg== HTTP/1.1
后来我注意到这些内联样式被添加到所有图像元素中:
display: none !important;
visibility: hidden !important;
opacity: 0 !important;
最后,我在控制台中没有收到任何“加载资源失败”的消息,而是这样的:
Port error: Could not establish connection. Receiving end does not exist.
如果您遇到任何这些事情,可能与 AdBlock 有关。将其关闭和/或重命名您的图像文件。
另外,由于 AdBlock 创建的内联 CSS,我的促销滑块的布局被扔掉了。虽然我能够在找到 Kabir 的解决方案之前使用 CSS 修复布局问题,但 CSS 有点不必要,并且影响了滑块处理多种尺寸图像的灵活性。
我想这个教训是:小心你给你的图片命名。这些图片没有恶意或烦人,因为它们以一种不引人注目的方式提醒访问者注意当前的促销和特价。