ＣＳＳで背景をランダム表示させたい
ＣＳＳ初心者です。
３分割のフレームのサイトで、mainページの背景をCSSで指定しているのですが
それをランダムに５種類の画像を表示出来るようにしたいのですが
何度やってもやり方が分からず教えてもらえませんでしょうか・・・
PHPは対応していないサーバーなので無理でした。
http://okwave.jp/qa/q4805263.htmlこちらも試してみましたが出来ませんでした・・・
どうかご教授願います。
ｓｔｙｌｅ.CSSから抜粋↓
/* デザイン全般設定 */
.ta1{border-bottom:1px solid #cccccc;background-color:#eeeeee;}
.ta2{background:url(bg02.gif) repeat-y 260px 0px;}
.ta3{background:url(bg01.jpg) repeat-y 95% 0%;}
#enter_page{overflow:hidden;}
#main_page{background:url(img/hptop1109.jpg) no-repeat 100% 50% fixed;}←ここでmainページの背景を指定しています。
#menu_page{border-bottom:1px solid #cccccc;background-color:#eeeeee;}
#left_page{background:url(bg02.gif) repeat-y 260px 0px fixed;}
.back{font-size:17px;text-align:right;background:url(back.gif) no-repeat 160px 90%;margin:20px 0px 0px 0px;padding:15px 20px 5px 0px;}
.back a:hover{text-decoration:underline;}
#main_page{background:url(img/hptop1109.jpg) no-repeat 100% 50% fixed;}
</style>
<script type="text/javascript">
window.onload = function(){
//var url = "a.jpg,b.jpg,c.jpg".split(',');
var url=[];
url[0] = 'top_bg01.jpg';
url[1] = 'top_bg02.jpg';
url[2] = 'top_bg03.jpg';
var n = Math.floor(Math.random() * url.length);
var elm = document.getElementById('main');
elm.style.backgroundImage = 'url(/image/' + url[n] + ')';
}
</script>
↑このように、#main_page{background～～の後ろに、参考サイトのをコピペしても何も表示されず背景は白のままになってしまいました。
色々頑張ってみたのですが分からないので、どなたか教えてくれませんか・・・
他に必要なソースがあれば追記いたします。
どうぞよろしくお願いいたします。
お礼
回答ありがとうございました。 御礼が遅くなり申し訳ありません。