2016-11-24 6 views
-1

私の趣味のラジオ局のWebページで作業しています。私はすでに、アーティストとタイトルが再生されていることを示しています。しかし、今私は、背景がアーティストと変化しているのを見たいと思います。だからフィル・コリンズが演奏しているとき、私は自分のバックグラウンドでフィル・コリンズのイメージを見たいと思っていました。JqueryのPHPリフレッシュの背景画像は10秒ごとです

私はすでに私はjQueryを使って背景画像を読み込むことができます方法を考え出しました:

$(".container").css("background-image", "url('images/bg/artist/<?php echo $newartist; ?>.jpg')"); 

しかし、私は、ページの読み込みの背景を表示し、それを10秒ごとに更新することができる方法を見つけ出すことはできません。

誰かが私を助けてくれることを願っています。

ありがとうございます!

Krijn

答えて

1

あなたはsetInterval(function(){ alert("Hello"); }, 3000);

http://www.w3schools.com/jsref/met_win_setinterval.asp

+1

を使用することができますが、私は親切にW3Schoolsの上MDNに助言することがあります。https://developer.mozilla.org/en-US/docs/Web/API/WindowTimers/setInterval – Pevara

0

ファーストをオフにしてみてください可能性があり、私はそれがそこに印刷されたアーティストを取得するスニペットをJSでPHPを使用している気づいたすべて。それがJavaScriptが実行されるまで待たなければならないので、トラフjsを設定することが本当に最初のイメージのための最良のオプションであるかどうか確かではありません。あなただけのようにも直接の容器でそれを設定できます。そのイメージを更新するために

<div 
    class='container' 
    style='background-image: url('images/bg/artist/<?= $newartist; ?>.jpg')' 
> 
    ... 
</div> 

、あなたは現在、アーティストトラフAJAXを取得する必要があります。だからあなたは現在のアーティストを返すことができる簡単なPHPスクリプトが必要になります。あなたがそのようにようにそのスクリプトを呼び出すことができます。

setInterval(updateArtist, 10000); 

私の頭の上からわずかいくつかの擬似コード:

function updateArtist() { 
    $.ajax({ 
     method: 'GET', 
     url: 'current_artist.php', 
     success: function(newArtist) { 
      $(".container").css("background-image", "url('images/bg/artist/" + newArtist + ".jpg')"); 
     } 
    }); 
} 

そして、10秒ごとに自動的にこれを行うには、あなたは間隔でそれを呼び出すことができますしかし、それは正しい方向にあなたを指すべきです。不明な点があればお気軽にお問い合わせください。

0

あなたは

setTimeout(function(){ alert("Hello"); }, 10000); 

See Demo Here: