我为我的品牌设计了一个静态网站 (www.beppo.in) beppo并将其托管在 Git 上。
在此处查看 Firefox 和 Chrome 中行为的比较:
该网页在 Chrome 中正常打开,但在 Firefox 中图像 anchor 链接被 stash ,因为 Firefox 向 class
属性添加了一些垃圾值。即使那样,根据我对一个元素的多个类的理解,该对象也应该正确呈现。但由于某些原因,这些元素被 stash 了。
该网页可能看起来有点棘手(我想通过设计给人留下深刻印象)并且我刚刚完成了网站的 5%,所以请原谅我的业余编码技能,因为我自从我开始就没有遵循任何编码惯例'我正在试验设计。
查看下面div_snds
中的img
元素的检测结果;注意 class="changesrc kybykzzeojjrekictcig"
:
<div id="div_snds">
<span class="label">Find us on:</span>
<a href="http://www.facebook.com/beppo.in" target="_blank" class="tooltip"><span class="small">facebook.com/beppo.in</span><img class="changesrc kybykzzeojjrekictcig" id="imgFb" src="images/fb.png" draggable="false" onmousedown="return false;" alt="FB" onmouseout="this.src='images/fb.png';" onmouseover="this.src='images/fb_link.png';"></a>
<a href="http://www.twitter.com/BeppoIndia" target="_blank" class="tooltip"><span class="small">twitter.com/BeppoIndia</span><img class="changesrc kybykzzeojjrekictcig" id="imgTwt" src="images/twitter.png" draggable="false" onmousedown="return false;" alt="TWT" onmouseout="this.src='images/twitter.png';" onmouseover="this.src='images/twitter_link.png';"></a>
<a href="https://www.google.com/+BeppoIndia" target="_blank" class="tooltip"><span class="small">google.com/+BeppoIndia</span><img class="changesrc kybykzzeojjrekictcig" id="imgGplus" src="images/gplus.png" alt="GPLUS" draggable="false" onmousedown="return false;" onmouseout="this.src='images/gplus.png';" onmouseover="this.src='images/gplus_link.png';"></a>
<a href="http://www.instagram.com/beppo.in" target="_blank" class="tooltip"><span class="small">instagram.com/beppo.in</span><img class="changesrc kybykzzeojjrekictcig" id="imgIns" src="images/instagram.png" draggable="false" onmousedown="return false;" alt="INSTA" onmouseout="this.src='images/instagram.png';" onmouseover="this.src='images/instagram_link.png';"></a>
<a href="http://www.beppoblog.wordpress.com" target="_blank" class="tooltip"><span class="small">beppoblog.wordpress.com</span><img class="changesrc" id="imgWord" src="images/wordpress.png" alt="WORDP" draggable="false" onmousedown="return false;" onmouseout="this.src='images/wordpress.png';" onmouseover="this.src='images/wordpress_link.png';"></a>
</div>
我想知道是因为 Git 作为宿主还是我的业余编码技能或任何其他意外的外部问题?
如果有人遇到过类似的问题并成功克服了,请帮助我。
最佳答案
神秘的类 kybykzzeojjrekictcig
是由广告拦截扩展添加的。它的名字是随机生成的。
您可以通过在 Firefox 中重现该问题来对此进行测试,然后禁用您正在运行的任何广告拦截扩展并尝试再次重现该问题。
您还可以使用 Firefox(或 Chrome,如果您发现相同的问题在那里发生)中的开发工具,并查找由于 kybykzzeojjrekictcig
或类似的随机命名而应用于元素的样式神秘类。您应该会看到如下内容:
display: none !important;
visibility: hidden !important;
opacity: 0 !important;
background-position: 1px 1px;
关于javascript - 为什么在 Firefox 中不加载图像 anchor 链接?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37909621/