几天前,我想知道为什么当我将网站上的图片的宽度和长度属性设置为百分比时,它并没有像我想象的那样缩放图像。
问题在于我希望它能缩小图像,但它实际上缩小了图像的容器。
无论如何,我真的很喜欢Pat建议使用jQuery片段调整图像大小,因为我可以很容易地将它应用到我的所有具有一类fancybox的图像,换句话说,我的产品图像,点击后,显示fancybox效果。
然而,由于某种原因,它表现得有点棘手。
如果您指向浏览器以便在我的页面上查看问题,则可以在http://www.marioplanet.com/product.htm处看到问题。
如果您之前访问过我的网站是为了帮助我调试,我感谢您,请确保删除我的网站的Cookie,并清空缓存,因为它似乎只是在第一次访问时出现问题。
对于不同的浏览器,问题似乎有所不同:
Firefox(3.6.8)和IE(8):在粗体文本下面读取:“类别毛绒”,图像应该正确调整大小,它们是小的。
Chrome(5.0.375.125)和Safari(5):在图像应该的同一个粗体文字下方,只有两个勾勒出的正方形而没有别的。
在没有更新代码的情况下,我发现的“修复”似乎是:
Firefox(3.6.8)和IE(8):简单的刷新,图像恢复到我希望他们第一次访问时的大小。
Chrome(5.0.375.125)和Safari(5):将这两个浏览器指向网址http://www.marioplanet.com/product.htm#,可以通过添加井号(#)或点击“中的YouTube”图标轻松完成关注我们在“社交网络托盘上,图像的大小将与我希望他们第一次访问时一样。”
所以,我想,关于jQuery片段,也许.width()动作没有得到广泛的支持,谷歌搜索没有产生任何结果,没有任何结果,没有它可以正常工作没有意义浏览器。
所以,那时我想也许jQuery的片段不在$(document).ready事件处理程序中,因此DOM以及图像没有被正确加载。在调查我的代码后,所有看起来都确定。
最后,我想知道我的图像上是否有任何大小调整已经搞砸了jQuery调整大小并且一切似乎都没问题,但是它可能与表格和表格行和单元格的宽度有关吗?
对于该问题的任何建议或想法将非常感谢!!
谢谢!
答案 0 :(得分:1)
问题确实是你的$(document).ready
处理程序,当这个运行时,DOM就准备好了,图像可能没有,并且可能不会在第一次加载时。它重新加载的原因是图像被缓存,因此立即加载。
虽然可以轻松解决此问题,而不是$(document).ready
使用window.onload
事件,如下所示:
$(window).load(function() {
//code that needs images
});
主要区别在于{/ 1}在加载图片后运行,因此onload
将为您提供正确的值,而不是.width()
。