0

我遇到了一个有趣的问题。我不知道可能是什么原因。我试图在互联网上搜索,但没有得到解决方案。问题是 offsetWidth 在 Chrome 中运行良好,但 offsetHeight 无法正常运行。有时它会返回值,但有时不会。请问有什么办法可以解决这个问题。

注意:我尝试过使用 id.height、id.clientHeight。但所有人都给我同样的问题。在我的项目中,我们也使用 Prototype 和 JQuery。

我也使用了原型 getHeight() .. 但不能在 Chrome 中工作。getWidth() 工作完美。但所有这些都在 Firefox 中运行良好...... :(

这是代码块

$('leftImage_<?php echo $iExtLoop; ?>').style.position="relative";
$('leftImage_<?php echo $iExtLoop; ?>').style.left= ($('leftImageDiv').offsetWidth - $('leftImage_<?php echo $iExtLoop; ?>').offsetWidth)/2 + "px";
$('leftImage_<?php echo $iExtLoop; ?>').style.top= ($('leftImageDiv').offsetHeight - $('leftImage_<?php echo $iExtLoop; ?>').offsetHeight)/2 + "px";

if($('stripLeft_<?php echo $iExtLoop; ?>')){
    $('stripLeft_<?php echo $iExtLoop; ?>').style.position="relative";
    $('stripLeft_<?php echo $iExtLoop; ?>').style.left= ($('leftImageDiv').offsetWidth - $('stripLeft_<?php echo $iExtLoop; ?>').offsetWidth) + "px";
    $('stripLeft_<?php echo $iExtLoop; ?>').style.top= ($('leftImageDiv').offsetHeight - $('stripLeft_<?php echo $iExtLoop; ?>').offsetHeight) + "px";                                      
}

重构的代码,由 Šime Vidas 添加:

var img = $( 'leftImage_<?php echo $iExtLoop; ?>' );
var div = $( 'leftImageDiv' );
var strip = $( 'stripLeft_<?php echo $iExtLoop; ?>' );

img.style.position = "relative";
img.style.left = ( div.offsetWidth - img.offsetWidth ) / 2 + "px";
img.style.top = ( div.offsetHeight - img.offsetHeight ) / 2 + "px";

if ( strip ) {
    strip.style.position = "relative";
    strip.style.left = ( div.offsetWidth - strip.offsetWidth ) + "px";
    strip.style.top= ( div.offsetHeight - strip.offsetHeight ) + "px";
}
4

1 回答 1

1

由于至少有一个元素似乎是 IMG 元素,我猜测该元素在执行代码时尚未完成加载。

图像必须单独检索(由浏览器),因此您必须确保仅在它们完成加载后才读取它们的高度。

于 2012-05-28T12:47:41.553 回答