0

DOM でレンダリングされた要素の高さを見つける方法はありますか。

ズームイン/ズームアウトしても、要素の実際の高さが得られるはずです。現在、私は使用しています：

HTML:

<div >
    <span><img src="Desert.jpg" style="border:none;width:100px" id="imgdiv"/></span>
    <br/>
    <input type="button" id="heightcalc" value="Find Height" />
</div>

jQuery:

$('#heightcalc').click(function(){
    alert($('#imgdiv').height());
});

100% ズームでは、画像の高さは 75 です。200%/300%/400% ズームでは、高さは同じ、つまり 75 です。私の要件は、ズームを上げるたびに高さも変更する必要があることです。画像の相対的な高さを見つける方法はありますか。これを IE9、Chrome/Firefox で試しましたが、結果は同じです。

また、clientHeight、offsetHeight、outerHeight を試してみましたが、うまくいきませんでした。

どんな助けでも大歓迎です。

ありがとうアニルバン

4

1 に答える 1

0

以下を使用して、すべてのブラウザーのズーム効果を計算しました。

https://github.com/yonran/detect-zoom

これにより、乗算係数を取得し、この係数に要素の実際の高さを掛けることができます。

コードは次のとおりです。アプリケーションにrequire jsを使用していることに注意してください。

require(["Widgets/detectzoom"], function (detectZoom) {
                zoom = detectZoom.ratios();
            });

            var heightofeachNode = ($("#dmcontent  ul li a span").eq(0).height()) * zoom.devicePxPerCssPx;
            self.pageSize = Math.round(($("#dmcontent").height()) / heightofeachNode) + 20 ;//20 - Its is the offset value

すべてのブラウザでテストしました [IE9, Chrome18.0, FF 11.0]

お役に立てれば。

アニルバン

于 2012-04-06T17:33:58.623 に答える