Question

我遇到了一些跨浏览器兼容性问题。而不是把所有代码放在这里，我链接到页面： http://www.smaskerando.org/spettacoli/disney.html
在页面的左下角，您可以看到一个小图库。单击小缩略图时，屏幕中间会出现较大版本的照片。它在Chrome上运行良好，但在Firefox和Internet Explorer上存在问题我认为问题出在以下几个方面：

$(".galleryPopUp").load(function(){
    var width = $(this).width()
    var height = $(this).height()

      if (width < height)
      {$(this).css("width","25%")}

      else
      {$(this).css("width", "50%")} 
})

他们似乎无法识别.load（）方法您可以从页面中获取完整代码，查找文件“script.js”并转到第379行（完整图库功能）。

你知道如何解决它吗？谢谢大家！

Answer 1

您应该将自己的脚本置于jQuery调用之下，因为您使用jQuery并且在调用它时可能无法使用。

这可能不是原因，而是一种粘性练习。

我尝试使用Chrome浏览器，看起来效果很好。

Answer 2

好的，我找到了解决方案！我希望它可以提供帮助。问题不在于.load()。这是关于我试图追加的div。实际上是一个非常小的差异，直到现在我才注意到：
Firefox和Internet Explorer自动引用我插入的图像的属性src的值。 Chrome没有这样做。所以更清楚：
这就是chrome上发生的事情：

... <img src="img/example.jpg" />

这发生在firefox / IE上：

... <img src=""img/example.jpg"" />

很明显，firefox无法识别图像。我使用jQuery migrate解决了这个问题并添加了这行if ( $.browser.mozilla )，并在使用firefox时从字符串中删除了“”。无论如何，谢谢你的快速回答！

跨浏览器库兼容性，.load（）问题？

2 个答案: