1

幅600ピクセルのdivがあります。画像を動的にプルしたい。画像のサイズは異なります。私がやりたいのは、画像サイズが600ピクセルを超える場合、divに収まるように画像のサイズを600ピクセルに変更することです。ただし、画像が600px以下の場合は、元の画像の幅のままにします。

jqueryを使用してそれを達成するにはどうすればよいですか？ありがとう。

4

4 に答える 4

7

画像に明示的な幅を指定せず（したがって、元の幅を使用する）、次のCSSプロパティを追加することで、JavaScriptなしでこれを実行できる場合があります。

<img style='max-width: 600px' src='...'>

警告：IE6では機能しません。互換性テーブル

于 2010-03-10T01:43:55.333 に答える
3

これはあなたを助けます：

$('img').each(function(){
    if($(this).width()>600){
        $(this).width(600).css('cursor','pointer').click(function(){$(this).css('width','');});
    }
});
于 2011-07-14T23:51:54.820 に答える
2

これらの画像をホストしている場合は、そこに到達したときにサーバー上で画像を拡大縮小することをお勧めします。そうすれば、帯域幅を節約し、ブラウザのダウンロード時間を短縮し、クライアント側でサイズを変更する必要がなくなります。

于 2010-03-10T02:12:17.640 に答える
0

cssを使用して画像の幅を100％に設定し、次のようにjQueryを使用してアスペクト比を維持できます。

$('#containerDiv img').width(); //gets width of image
$('#containerDiv img').height(); //gets height of image

アスペクト比を維持するように計算してから、height()プロパティを使用して画像の新しい高さを設定できます。

于 2010-03-10T01:44:50.013 に答える