ランダムイメージ、2つの異なるdivs [HTML、JavaScript]

だから私はいくつかの助けが必要です。私は小さなiphoneサイトを持っていて、同じ色のバーにランダム（4つの画像）をしたい。だから、それをどのように行うこのランダムイメージ、2つの異なるdivs [HTML、JavaScript]

Barred1.jpg , Barred2.jpg , Barred3.jpg Barred4.jpg 
Barblue1.jpg , Barblue2.jpg , Barblue3.jpg Barblue4.jpg 
Barpink1.jpg , Barpink.jpg , Barpink3.jpg Barpink4.jpg 
Bargreen1.jpg , Bargreen2.jpg , Bargreen3.jpg Bargreen4.jpg

よう

（テーマのように）？

すべてのバーが異なるのdivにある

私は私の悪い英語のためにごめんなさい。 JavaScriptが（this techniqueを使用して）ランダムに色を選択してから、このようなページ上のすべての画像を介して動作可能性があり

出典

2011-01-29 user594568

：

var imgs = document.getElementsByTagName('img'), 
i = imgs.length; 
while (i) { 
    i -= 1;

次に、あなたはそうのような画像のsrc属性をチェックすることができます

 imgs[i].src = 'Bar' + random_color + '.jpg';

：それは一致した場合

if (/^Bar([a-z]+)\.jpg/.test(imgs[i].src)) {

、ちょうどあなたのJSが到着した色でSRCを切り替えます

出典

2011-01-29 00:11:24 sdleihssirhc

私に例を挙げてもらえますか？ – user594568

ステップ1は、次に、各色に番号を割り当てる色を選択するために乱数を使用することである

var colors = new Array("red","blue","pink","green"); 

var random = Math.floor(Math.random()*4);

ステップ2色

for (var i=1; i < 5; i++){ 

document.getElementById("img"+i).src = "Bar"+colors[random]+i+".jpg"; 

}

出典

2011-01-29 00:14:33 WebChemist

ああああ..ここにいくつかのループを巻き戻す必要があります。それのための必要はありません（実際にはそれほど重要ではありません;）） –

私はexaple、pelaseが必要です。 – user594568

にIMG srcを設定するforループを使用することですjqueryの使用：

<html> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> 
<script> 

var a = ['red', 'blue', 'pink', 'green']; 

function setBarTheme(bar, idx) 
{ 
$(bar).css('background-image', 'url(Bar' + a[idx] + '.jpg)'); 
} 

$(document).ready(function(){ 

var r = Math.floor(Math.random()*4); 

setBarTheme('#bar1', r); 
setBarTheme('#bar2', r); 
setBarTheme('#bar3', r); 
setBarTheme('#bar4', r); 

}); 


</script> 
</head> 
<body> 

<div id="bar1"></div> 
<div id="bar2"></div> 
<div id="bar3"></div> 
<div id="bar4"></div> 

</body> 
</html>

出典

2011-01-29 00:22:22

ランダムイメージ、2つの異なるdivs [HTML、JavaScript]

答えて

関連する問題