解決済み

背景のことで

  • 困ってます
  • 質問No.260858
  • 閲覧数111
  • ありがとう数0
  • 気になる数0
  • 回答数1
  • コメント数0

お礼率 4% (1/23)

ジャバスクリプトで、背景をランダムに表示させる というものがありますが
この背景の位置を指定してランダムに表示させる方法は無いでしょうか?
例えば、背景画像を真ん中に固定してその背景画像をランダムに表示させるようにしたいのですが・・・。
(普通に画像で表示させるのではなく、背景で)

どなたか位置を指定して出来る方法を知っている方が居ましたら教えて下さい。
通報する
  • 回答数1
  • 気になる
    質問をブックマークします。
    マイページでまとめて確認できます。

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

  • 回答No.1
レベル10

ベストアンサー率 61% (70/113)

HTML単独では位置を指定する方法がありませんので不可能です。
が、スタイルシートを使用するなら可能です。

背景画像を変更するには
document.body.style.backgroundImage="url(sample.jpg)";
のようにします。繰り返し表示をやめる場合は
document.body.style.backgroundRepeat="no-repeat";
のようにします。表示位置指定は
document.body.style.backgroundPosition="center center";
とします。
よって、a.jpg、b.jpg、c.jpgのどれかをランダムで中央に背景として表示するスクリプトは次のようになります。
<HTML>
<HEAD>
<SCRIPT>
imageList = new Array();
imageList[0] = "a.jpg";
imageList[1] = "b.jpg";
imageList[2] = "c.jpg";

function imageSelect() {
var index = Math.floor(Math.random() * imageList.length);
document.body.style.backgroundPosition = "center center";
document.body.style.backgroundRepeat = "no-repeat";
document.body.style.backgroundAttachment = "fixed";
document.body.style.backgroundImage = "url(" + imageList[index] + ")";
}

</SCRIPT>
<BODY onload="imageSelect()">
</BODY>
</HTML>
このQ&Aで解決しましたか?
AIエージェント「あい」

こんにちは。AIエージェントの「あい」です。
あなたの悩みに、OKWAVE 3,500万件のQ&Aを分析して最適な回答をご提案します。

関連するQ&A
こんな書き方もあるよ!この情報は知ってる?あなたの知識を教えて!
このQ&Aにはまだコメントがありません。
あなたの思ったこと、知っていることをここにコメントしてみましょう。

その他の関連するQ&A、テーマをキーワードで探す

キーワードでQ&A、テーマを検索する

特集


より良い社会へ。感謝経済プロジェクト始動

ピックアップ

ページ先頭へ