jQuery 在 IE8 中按预期工作,但在 Chrome 中却不行...需要有人检查我的代码

发布于 2024-09-28 14:47:54 字数 699 浏览 0 评论 0原文

我最近更新了一个网站,使其在 IE8 中看起来几乎和在 Chrome 中一样好。我已经成功地正确应用了角,但是如果您看一下 http://clarkeyboy.zxq。 net/test_longcatalogueitems.htm 您会注意到目录行在 IE8 中按预期显示,但在 Chrome 中却不然。在 Chrome 中,它们似乎会永远持续下去。

有人可以看一下上面页面中的 jQuery / css 并告诉我他们认为我哪里出错了吗?很抱歉,我无法缩短 CSS 文件 - 它们通常非常大,但该页面中需要所有样式(或至少大多数样式)来演示问题。

我还注意到本地主机上的一些奇怪行为,我似乎无法在上面的页面上重现。有时页面在 Chrome 中完美显示,有时目录行显得稍短,有时会脱离页面。我不明白这是为什么。

任何帮助将不胜感激。

问候,

理查德

PS,如果有人对我如何改进我的代码有任何建议,但仍然达到相同的效果,请说出来。

我对如何在不使用 JavaScript 的情况下使用目录行实现 jQuery 功能的任何提示特别感兴趣。我基本上有一个未知大小的图像(img 标签的宽度和高度是通过查看服务器端的图像并在它大于最大缩略图大小时缩小它来放入的),我想获取描述跨越整个高度并距图像最多 20 像素。

I have recently been updating a site so that it looks nearly as good in IE8 as it does in Chrome. I have managed to get the corners applied correctly, but if you take a look at http://clarkeyboy.zxq.net/test_longcatalogueitems.htm you will notice that the catalogue rows appear as expected in IE8 but not in Chrome. In Chrome they appear to go on forever.

Could somebody please take a look at the jQuery / css in the above page and tell me where they think I am going wrong? I am sorry that I wasnt able to shorten the CSS files - they are generally quite huge but all the styles (or at least most) are needed in that page, to demonstrate the problem.

I have also noticed some weird behaviour on localhost which I appear to be unable to reproduce on the above page. It appears that some of the time the page displays perfectly in Chrome, sometimes the catalogue rows appear slightly shorter and sometimes they go off the page. I dont get why this is.

Any help would be greatly appreciated.

Regards,

Richard

PS if anyone has any tips on how I could improve my code but still achieve the same effect then please say so.

I am particularly interested in any hints on how I could achieve the jQuery stuff that I am doing with the catalogue rows without JavaScript. I basically have an image of unknown size (the width and height of the img tags are put in by looking at the image on serverside and scaling it down if it is bigger than the maximum thumbnail size) and I would like to get the description to span the full height and up to 20px away from the image.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

十年九夏 2024-10-05 14:47:54

您根据文档中图像的宽度设置属性,并且是在文档准备就绪时执行此操作。

文档就绪伪事件在 HTML DOM 填充后一段时间触发;它不保证所有图像都已加载。在 Chrome 和其他支持 HTML5 DOMContentLoaded 事件的浏览器上,文档就绪回调通常会比其他浏览器更早发生,这意味着图像尚未加载的可能性更大。

如果您想在页面中的所有内容(包括图像)准备就绪时调用函数,则应该使用 load 事件 ($(window).load(function() { ... });)。虽然我真的不知道为什么你要在这里搞乱脚本布局,因为我没有立即在该页面上看到任何无法使用简单 CSS 完成的内容。

You're setting properties based on the widths of images in the document, and you're doing it on document-ready.

The document ready pseudo-event fires some time after the HTML DOM has been populated; it does not guarantee all the images are loaded. On Chrome and other browsers that support the HTML5 DOMContentLoaded event, the document-ready callback will typically occur sooner than on other browsers, meaning more chance the images haven't loaded yet.

If you want to call a function when everything in the page, including images, is ready, you should be using the load event ($(window).load(function() { ... });). Although I don't really know why you're messing around with scripted layout here as I don't immediately see anything on that page that couldn't be done with simple CSS.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文