0

したがって、ユーザーがウィンドウのサイズを変更したときに、正しいアスペクト比を使用してサイズが変更されるコンテナー(DIV)があります(つまり、ストレッチされません)。

ここで、jQueryを使用して、そのコンテナー内のすべての要素のサイズを動的に変更したいと思います。これらの要素も、アスペクト比を正しく維持する必要があることに注意してください。

CSS3 2D Transformsオプションがあることは知っていますが、CSS3を使用せずに、jQueryと古いCSSのみを使用して、古いバージョンのIEでも機能するようにしたいと思います。

これがコードです。ご覧のとおり、width = 100%を使用したため、画像はアスペクト比を維持しますが、他の要素には独自のサイズ(幅と高さ)があり、パーセントで表示することはできません。

したがって、理想的には、ウィンドウのサイズを変更するときに、これらの要素の幅、高さ、上下の位置を設定して、アスペクト比を正しく維持するのが好きです。 http://jsfiddle.net/Km8Ef/1/

良い解決策はありますか?

4

1 に答える 1

1

マークアップを見ずに何を達成しようとしているのか正確にはわかりませんが、パーセンテージ幅を使用しないのはなぜですか? コンテナーは、コードに基づいて手動で設定されます...

<div id="container" style="width:500px">
    <div id="inner" style="width:50%">
        <img style="width:100%" src="image.jpg"/>
    </div>
</div>
于 2012-07-20T19:49:42.343 に答える