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

少なくとも1つの要素がIMG要素のように見えるので、コードが実行されるまでに要素の読み込みが完了していないと推測されます。

画像は（ブラウザで）個別に取得する必要があるため、画像の読み込みが完了した後でのみ画像の高さを読み取るようにする必要があります。

于 2012-05-28T12:47:41.553 に答える