• ベストアンサー

固定の背景画像をランダム表示したい。

現在、ＨＰを作成中なのですがどうしてもうまくいきません！！(>_<) お力をお貸しください！！ ---- 固定してある背景画像を、アクセスするたびにランダム表示をしたいのです！ 固定してない背景をランダム表示する方法はわかるのですが、固定してあるとどうしてもできません…。 なにかいい方法はありませんでしょうか？ ちなみに画像が固定してある場所は、画像毎にちがいます。 よろしくお願いします！！

質問者が選んだベストアンサー

  • ベストアンサー
  • BLUEPIXY
  • ベストアンサー率50% (3003/5914)
回答No.2

せっかくスタイルで、あらかじめbodyのスタイルを２種類用意していても、 body{} body{} では、後の方が有効になってしまいます。 また、スクリプトで画像を指定するなら、スタイルの方で指定しても仕方ないです。 スクリプトで全て設定するのも１つの方法ですが、（最小限の変更で） スタイルを２つに分けてクラスの切り換えでやる方法のサンプルに書き換えてみました。 <body class="A"> <body class="B"> のようにしてスタイルをスクリプトから切り換えます ＩＥとＦｉｒｅＦｏｘで動作確認しました。 ----------------------------------------------- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <TITLE>タイトルname</TITLE> <STYLE type="text/css"> <!-- body.A{ background-attachment:fixed; background-image : url(画像Ａ.jpg); background-repeat:no-repeat; background-position:100% 0%;} body.B{ background-attachment:fixed; background-image : url(画像Ｂ.jpg); background-repeat:no-repeat; background-position:0% 100%;} --> </STYLE> </HEAD> <BODY> <script language="JavaScript"> <!-- topimg = new Array("A","B"); document.body.className = topimg[Math.floor(Math.random() * topimg.length)]; // --> </script> </BODY> </HTML>

suzunari_rin
質問者

お礼

ばっちりできました！！！ ありがとうございます！！！ sleionirとLunascapeでも動作しました♪ 内容もわかりやすく、とても勉強になりました。 本当にありがとうございますm(_ _)m

その他の回答 (1)

  • BLUEPIXY
  • ベストアンサー率50% (3003/5914)
回答No.1

現在は、どのようにやっておられるのでしょうか キモの部分のソースをアップしていただけませんか？

suzunari_rin
質問者

補足

お返事ありがとうございます。 回答が遅くなって申し訳ございません。 現在ソースはこのようなかんじデス。。。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <STYLE type="text/css"> <!-- body{ background-attachment:fixed; background-image : url(画像ＡのURL); background-repeat:no-repeat; background-position:100% 0%;} --> <!-- body{ background-attachment:fixed; background-image : url(画像ＢのURL); background-repeat:no-repeat; background-position:0% １00%;} --> </STYLE> <TITLE>タイトルname</TITLE> </HEAD> <BODY> <script language="JavaScript"> <!-- topimg = new Array("画像ＡのURL","画像ＢのURL"); document.body.style.backgroundImage = "url(" + topimg[Math.floor(Math.random() * topimg.length)] + ")"; // --> </script> </BODY> </HTML> …初心者なもので、たぶんぐっちゃぐちゃかもしれませんが、 よろしくお願いします。

  1. カテゴリ
  2. インターネット・Webサービス
  3. その他（インターネット・Webサービス）

関連するQ&A

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVE セレクト

質問する