背景画像のランダム表示
お世話になります。
PHP勉強中です。
1.背景画像のランダム表示:bodyタグ内でなくdiv内の背景画像を変更したい。bottom right指定等施したいのでスタイルシートで書き出す??
2.確率を設定したい:1枚の基本画像が60%表示され、それ以外の複数の画像が40%で選択、その中で画像をランダムに設定したい。
3.使用する画像は同一フォルダ内にある、背景画像以外はいれない。今後枚数を増やしていく予定なので、ファイル名を1つずつ指定するのではなく、フォルダ内の画像を読んで、配列に・・・
と、やりたいことはあるのですが、どうやったらいいのやら・・・頭が混乱してます(汗)
私のサイトに訪問される方でjsをOFFにされている方が多少いらっしゃるので、どうせならPHPで!と意気込んでみたのですが・・・
もしよろしかったらご教授下さいませ。
よろしくお願い致します。
参考:現在設置のjsファイル
<script>
wall = new Array();
wall[0] = "./image/bg01.jpg";
wall[1] = "./image/bg02.jpg";
wall[2] = "./image/bg03.jpg";
wall[3] = "./image/bg04.jpg";
wall[4] = "./image/bg05.jpg";
wall[5] = "./image/bg06.jpg";
wall[6] = "./image/bg07.jpg";
wall[7] = "./image/bg08.jpg";
rnd = Math.round(Math.random() * (wall.length - 1));
document.write('<style type="text/css">div.mainTOP { background:url(' , wall[rnd] , ') no-repeat bottom right #FAFAFA; }</style>');
</script>
お礼
解決できましたーーー! LancerVII さん本当にありがとうございました!^^
補足
LancerVII さん回答ありがとうございます。 ランダム表示は <html> <head> <title></title> </head> <body> <script language="JavaScript"> <!-- // ランダムに背景画像を変更する bgc = new Array(); bgc[0] = "url(sample1.gif)"; bgc[1] = "url(sample2.gif)"; bgc[2] = "url(sample3.gif)"; bgc[3] = "url(sample4.gif)"; bgc[4] = "url(sample5.gif)"; n = Math.floor(Math.random()*bgc.length); document.body.style.backgroundImage = bgc[n] //--> </script> </body> </html> これで動作が確認できました。 またリサイズは <html> <head> <title></title> <script src="jquery-1.6.4.min.js"></script> <script src="jquery.backstretch.min.js"></script> <script> $.backstretch("coffee.jpg"); </script> </head> <body> </body> </html> 上記で出来ました。 すごく初歩的な質問なのだと思いますが、 リサイズをどうやってすべての画像に適用させるのかがわかりません。 $.backstretch(" "); ではひとつの画像を指定するようなので どうすればいいのかさっぱりなんです;_;