1

私はプロジェクトに取り組んでおり、次のものを作成しようとしています:

互いに下に 3 つ以上の div を配置したい (コンテンツと背景画像を含む)。ブラウザーを開くと、これらすべての div はブラウザーのサイズ (幅と高さ) に合わせて自動的にサイズ変更する必要があります。ブラウザー ウィンドウのサイズを (更新せずに) 変更する場合、div は元のサイズと同じ大きさにする必要があります (ウィンドウに合わせてサイズを変更しないでください)。ブラウザー画面を小さくして更新すると、div が新しいウィンドウ サイズに調整されます。(最小幅は 1024 にする必要があるため、div はそれよりも小さくなりません)

div内に背景画像を追加したい。（写真）。私の目標は、写真のサイズを正確にdivサイズに変更することです。したがって、高さは写真/divの幅に合わせてスケーリングする必要があります。

例: ブラウザー ウィンドウが 1024x768 の場合、div と写真は 1024x768 である必要があります。ブラウザのサイズを変更しても、div は 1024x768 のままです。ブラウザーのサイズを 1280x720 に変更して更新すると、div はそのサイズに自動的に調整されます。div の高さは、常に幅に合わせて調整する必要があります。

誰もこれを作る方法を知っていますか？私は他のどこにもそれを見つけることができません。

4

2 に答える 2

2

http://jsfiddle.net/MQkmk/1/

$(function(){               // when the page is loaded ...
    var $f = $('#fixy');    // .. make current size permanent. 
    $f.css({
        width:  $f.width(),
        height: $f.height()
    });
});
于 2012-06-17T18:08:37.133 に答える