0

私は2つの画像を持っています：A.pngそしてB.png

デバイスの解像度に基づいて画像を読み込もうとしています

ページがデスクトップにロードされている場合は A.png をロードする必要があり、iPhone にロードされている場合は B.png をロードする必要があります。

Javascript:

var heights = $(window).height(); 
if (heights < 500) {
    // load B.png
}
else {
    // load A.png
}

これを可能にするためのアイデアや提案はありますか?

コードイグナイターを使用しています。

どうもありがとう。

更新 これが私が使用したロジックです

@media only screen and (min-device-width : 320px) and (max-device-width : 480px)
{
img.bannerimage{background:url(<?=base_url();?>mbanner/<?=$mbanner?>);} 
}
@media only screen and (min-width : 1224px)

{
img.bannerimage{background : url(<?=base_url();?>uploads/<?=$bannerimage?>);}
}

でもうまくいかない（CSSが苦手）、

4

1 に答える 1

0

jQuery を使用している場合は、デスクトップ/モバイル ブラウザーの幅/高さを確認できます。

var height = window.innerHeight || $(window).height();
var width = window.innerWidth || $(window).width();
var img = new Image();
if (height > 500) {
    img.src = '/a.png';
} else {
    img.src = '/b.png'
}
$('body').append(img);
于 2013-04-26T18:01:09.453 に答える