1

さまざまなブラウザーで背景をページ全体に広げる際の問題により、ページをカバーするために画像を含む div を使用する必要がありました。

私がやろうとしているのは、この画像を時間帯に応じて変化させることです。CSS で従来の background-image プロパティを使用していたときは問題なく動作していましたが、画像の src 属性を変更するためにそれを変換する際に問題が発生しています。

画像IDは#bgです。私はおそらく構文エラーを犯していますが、どんな助けも素晴らしいでしょう、ありがとう!

$('document').ready(function(){

 var hours = getDayTime(new Date().getHours());

if (hours > 20 || hours < 5) {
    $('#page-background > img').prop('src', 'backgrounds/night.jpg')
}    

else if (hours > 17) {
    $('#page-background > img').prop('src', 'backgrounds/dusk.jpg')
}    

else if (hours > 8) {
    $('#page-background > img').prop('src', 'backgrounds/day.jpg')
}

else { 
    $('#page-background > img').prop('src', 'backgrounds/dawn.jpg')
}
});


<div id="page-background"><img src="backgrounds/day.jpg" width="100%" height="100%" alt="" id="bg" /></div>
4

5 に答える 5

2 
$('#bg img').attr('src', 'backgrounds/night.jpg')

ただあるべき

$('#bg').prop('src', 'backgrounds/night.jpg')

画像の を指定したidので、 を含める必要はありませんimg。そして、jQuery 1.6 の時点で.prop()推奨されていますattr()

于 2012-05-30T17:11:26.127 に答える
2

もし ：

<img src="someimage.jpg" id="bg" />

それは次のとおりです。

$('#bg').attr('src', 'backgrounds/night.jpg')
于 2012-05-30T17:12:06.733 に答える
1

あなたの問題に対する別のより機能的な解決策は次のとおりです。

$("#bg").attr("src", function(i, value) {
    var src = "backgrounds/";

    if (hours > 20 || hours < 5) src += "night.jpg";
    else if (hours > 17) src += "dusk.jpg";
    else if (hours > 8) src += "day.jpg";
    else src += "dawn.jpg";

    return src;
});

はい、#bgこれは画像そのものであるため、セレクターを使用する必要があります。

于 2012-05-30T17:13:43.920 に答える
1 
$('#bg').attr('src', function() {
    var src = 'backgrounds/dawn.jpg';
    if (hours > 20 || hours < 5) {
        src = 'backgrounds/night.jpg';
    } else if (hours > 17) {
        src = 'backgrounds/dusk.jpg';
    } else if (hours > 8) {
        src = 'backgrounds/day.jpg';
    }
    return src;
})
于 2012-05-30T17:14:22.923 に答える
1

おそらく使用する必要があります

$('#bg')

それ以外の

$('#bg img')

2 番目のケースでは、要素 #bg の下にあるすべての IMG 要素を選択しています。

于 2012-05-30T17:11:26.200 に答える