スタイルシートは外部から読み込ませるもので、
body{
background-image: url(XXX.gif);
background-position: 550px 90%;
background-repeat:no-repeat;
background-attachment: fixed;
}のような感じです。
Javascriptはhttp://homepage3.nifty.com/west-mira/javascript/picture/background5.htmlのものを使わせていただこうと思っています。ソースを書いていただいても、この両方の組み合わせ方を教えていただいてもどちらでも構いませんが、なるべく具体的にお願い致します。
<script language=”JavaScript”>
<!--//Copyright (C) WEST MiRa
my_pics=new Array();
//ランダムで表示したい画像を指定する
my_pics[0]=’0.gif’;
my_pics[1]=’1.gif’;
my_pics[2]=’2.gif’;
my_pics[3]=’3.gif’;
my_pics[4]=’4.gif’;
a=Math.floor(Math.random()*my_pics.length);
document.write(’<style type=”text/css”>’);
document.write(’body{’)
document.write(’background-image: url(”’+my_pics[a]+’)’);
//-->
</script>
background-position: 550px 90%;
background-repeat:no-repeat;
background-attachment: fixed;
}
</style>
このような感じだと思います
普通にランダムにファイル名を変えてはいかがでしょうか?
例:
fName = ””;
a = Math.random()*2;
if (a<= 0) fName = ”test1.css”;
else fName = ”test2.css”;
document.write(”<link rel=’stylesheet’ href=’”+fName+”’ type=’text/css’>”);
ありがとうございます。
そういう方法もあるのですね。
ただ、スタイルシートには背景の画像以外の要素についても指定しているので、背景画像のみ変えられる方法はないかなあ…と思って質問致しました。
先ほどの補足です。Javascriptを使っているので、HTMLのHEAD要素内に入れてください。
わざわざありがとうございます。
ぅぅ、HTMLのHEAD要素内に入れてみたのですが、
なぜか、
background-position: 550px 90%;
background-repeat:no-repeat;
background-attachment: fixed;
}がページ内に表示されてしまいました。
Javascriptだけで後で、背景画像を変更したり
最初にランダムで変更したりも出来ます
リンク先参照
ただスタイルシートを使った固定背景を使う
(スクロールさせても動かない奴とか)を使うなら最初の回答の様にスタイルシートを読み込んでください
ありがとうございます。
追記;最初の回答についてですが、’と”を半角に直し、
document.write(’background-image: url(”’+my_pics[a]+’”);’);
としてみたところ、うまく表示させることが出来ました。
ということで、質問を終了させていただきます。
お答えいただいた皆様、どうもありがとうございました。
ありがとうございます。
これをそのまま、外部に指定しているスタイルシートの中に入れればよいのでしょうか?