$(this).css("width") 不适用于 Safari 中的锚标记答案

【问题标题】：$(this).css("width") not working on ancohor tags in Safari$(this).css("width") 不适用于 Safari 中的锚标记
【发布时间】：2010-11-25 09:14:29
【问题描述】：

我正在使用 CSS 选择器为 Web 模板生成自定义弹出窗口 - 基本上，有些制作者对 JS 不满意，我需要一种简单的方法让他们设置弹出窗口大小等。我'我对这种方法的优点并不真正感兴趣，而是希望了解为什么 jquery 似乎无法获得 CSS 中为 Safari 中的锚定义的宽度和高度。

见：http://f1shw1ck.com/jquery_sandbox/csspops.html

我的问题的实质：

对于选择器a.popup {width: 800px;height: 560px;}和锚<a href="http://www.metmuseum.org/toah/hd/apol/hd_apol.htm" class="popup">African Rock Art: Apollo 11 Cave Stone (c. 25,500 - 23,500 BCE)</a>为什么是

if ($(this).css("width")) {   
windowParams.width = $(this).css("width");
}
if ($(this).css("height")) {   
windowParams.height = $(this).css("height");
}

两个属性在 Safari 中都返回为零？

其他浏览器中的onclick弹出警报：toolbar=no,directories=no,location=no,resizable=yes,menubar=no,scrollbars=yes,status=no,width=800px,height=560px,top= 20,左=240

Safari 中的警报：工具栏=no,directories=no,location=no,resizable=yes,menubar=no,scrollbars=yes,status=no,width=0px,height=0px,top=20,left=640

感谢您帮助我理解。

【问题讨论】：

标签： jquery css popup width

【解决方案1】：

安迪是对的。这里提供了一个解决方案：

Get the real width and height of an image with JavaScript? (in Safari/Chrome)

【讨论】：

嗯，锚点的高度和宽度不是在文档加载时设置的吗？
这是关键概念：“根本问题是 WebKit 浏览器（Safari 和 Chrome）并行加载 JavaScript 和 CSS 信息。因此，JavaScript 可能在计算 CSS 的样式效果之前执行，返回错误的答案。”
我添加了 "if (jQuery.browser.safari && document.readyState != "complete"){ //console.info('ready...'); setTimeout( arguments.callee, 100 ); return; } " 我认为这意味着 javascript 将在计算 CSS 之后执行。但我仍然得到错误的答案。

【解决方案2】：

它在 Chrome 中也不起作用。

从this link 和this other Stack Overflow answer 看来，原因似乎是Webkit 浏览器在完全加载之前会报告'0' 或'unknown' 作为大小，这可能为时已晚。

正如 Micah 所说，这是因为 Javascript 和 CSS 是并行加载的，这意味着在脚本运行时样式可能尚未完全应用。

【讨论】：

抱歉，图片尺寸是多少？我的页面中没有任何图像...我在这里处理锚点...对不起，您是说锚点以相同的方式加载，因为这对我没有任何意义。
是的 - 抱歉，我应该澄清一下。正如 micah 所说，问题是 Javascript 和 CSS 是并行加载的……图像或锚点或其他。