• ベストアンサー

背景色をページ読み込み時に変更したい

タイトルの通りですが、PHPかJavascriptを使って背景色がロードする度にランダムに変更される。というのを作りたいです。 外部cssのbody {background-color:○○○;}の部分を変えれば良いと思うのですが、やり方がわからなくて困っています。 ご教授お願いします。

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

  • ベストアンサー
  • yambejp
  • ベストアンサー率51% (3827/7415)
回答No.1

たとえばこういうので? //main.php <head> <link rel="stylesheet" type="text/css" href="css.php"> </head> <body> test </body> //css.php body{background-Color: <? $b=Array("red","yellow","blue","green"); shuffle($b); $a= array_shift($b); print $a; ?> ;}

sho27_2009
質問者

お礼

解答ありがとうございます!参考にさせて頂きます!

全文を見る
すると、全ての回答が全文表示されます。

その他の回答 (1)

  • BellBell
  • ベストアンサー率54% (327/598)
回答No.2

$RamdomColor = array("red.css","black.css","blue.css","green.css","white.css"); $Color = $RamdomColor[mt_rand(0,count($RamdomColor)-1)]; ~~~ <link rel="stylesheet" type="text/css" href="<?PHP echo $Color; ?>"> <link rel="stylesheet" type="text/css" href="main.css"> main.cssにはフォントサイズや、オブジェクトサイズ等の変化しないCSS(=main.css)を記述して、ランダムに変化する背景色、および背景色に連動して変わる文字色等は別のCSS(=red.css等)ファイルで定義して、ランダムに読み込むって形です。

sho27_2009
質問者

お礼

解答ありがとうございます!お陰様で解決できそうです。ありがとうございました!

全文を見る
すると、全ての回答が全文表示されます。

関連するQ&A

  • 閲覧時に背景色、文字色をcssで変更したい

    WindowsXP、Firefox3を使用しています。 白背景に黒文字という一般的なウェブページの配色はまぶしいので、 Stylishというアドオンを使ってcssで背景色、文字色を変更しようと思い、 以下のようなcssを作成しました。 ------------------------ここから body { color: #696969 !important; background-color: #dcdcdc !important; background-image:none !important; } td { color: #343434 !important; background-color: #d3d3d3 !important; background-image:none !important; } ------------------------ここまで しかし、これだと色が変更できない領域があります。 例えば、 http://www.yahoo.co.jp/  ……一番下?の背景色しか変わりません http://www.4gamer.net/   ……一切変化しません http://www.flay.com/    ……背景色は変わりますが、文字色が変わりません アドオンを使わず、userContent.cssを使う方法にしても結果は同じようです。 どのウェブページでも背景色と文字色を変更するには、どう記述すればよいのでしょうか?

  • 外部シートの背景色を得る

    xx.cssに .bodybg{background-color: #eeeeee} と書いてあります。 こうしてbodyの背景色が決められています。 このbodyの中から#eeeeeeを得ようとして <head> <title></title> <link rel="stylesheet" type="text/css" href="xx.css"> </head> <body class="bodybg"> <script language="JavaScript"> function func(){ alert(document.body.bgColor) } </script> と書きました。得たいのは#eeeeeeですが、単に#eeeeeeといて得るのではなく、bodyの背景色を得る方法を教えてください。

  • 背景ランダム

    JavaScriptを使って背景をランダムに変更したいので すが、その背景ごとにを左上固定や縦リピートなど を設定することは出来るのでしょうか? 宜しくお願い致します ちなみにCSSは基本だけですが理解しています <SCRIPT LANGUAGE="JavaScript"> <!-- function randomWall() { if (navigator.appVersion > '5' || (navigator.appName == 'Microsoft Internet Explorer' && navigator.appVersion > '4')) { var max = 6; wall = Math.floor(Math.random() * max) + 1; if (wall == 1) { document.body.background = '1.gif' } else if (wall == 2) { document.body.background = '2.gif} } } //--> </SCRIPT>

  • 指定した背景画像をサイトを訪れるたびに切り替える

    Javascript初心者で、全く見当がつきません。 お力をお貸しください。 参考サイトのように、 Bodyではなく、DivのID一部分のみ、 背景画像がサイトを訪れるたびに切り替わるようにしたいのですが, どのサンプルも「Body」の背景が変わってしまいます。 どなたか、お答えして頂けないでしょうか? <参考サイト> http://www.upenn.edu/ <現在記述中のソース> <html> <head> <style type="text/css"> #content { color: #ffe700; font-size: 30px; height: 600px; } </style> <title>見る度に背景色が変わります</title> <script language="JavaScript"> <!-- function color(){ bgcolor = "#"; for(i = 0 ; i < 6 ; i++) { //0から15の乱数を発生させる color = Math.floor(16 * Math.random()); //16進数に変換 color = color.toString(16); //つなぎ合わせる bgcolor = bgcolor + color; } //文字列を背景色に document.bgColor = bgcolor; } //--> </script> </head> <body onLoad="color()"> 見る度に背景色が変わります<br> <div id="content"> ここの背景にランダムに画像が変更して欲しい。Bodyではなく、Divの指定したID内にのみ表示して欲しいのです</div> </body> </html>

  • CSSで背景画像をランダムに表示させたいのですが

    CSSで背景画像をランダムに表示させたいのですが、簡単な対応方法などありますでしょうか? 背景のランダム表示としてbody部分をjavascriptで背景のランダム処理はたくさんあるのですが、今回はスタイルシートでbodyではなく、サイト内のいち部分のクラス要素の背景をランダムに表示させたいと思っています。 <div class="main"> ここにコンテンツがあって、このmainのクラス要素の背景をランダムに変えたいです。 </div> スタイルシートの方では現在は .main { float:left; background-image:url(/image/top_bg01.jpg); background-repeat:no-repeat; min-width:736px; height:auto; border-right:1px solid #000000; } としており、このtop_bg01.jpgの部分の画像を top_bg01.jpg top_bg02.jpg top_bg03.jpg top_bg04.jpg top_bg05.jpg とランダムに表示させたいのですが、対応方法が分からずに困っています。 http://www.designwalker.com/2006/12/random-css.html はためしてみましたが、PHPがうまく対応できずに断念してしまいました。 どなた様か宜しくお願いいたします。

    • ベストアンサー
    • HTML
  • styleの直接指定が効きません。

    外部ファイルにてbodyに背景画像を設定しているんですが、インラインフレームの中だけ背景色にしたく、 (1)<head>内に <Link rel="stylesheet" href="style.css" type="text/css"> <style type="text/css"> body { background-color: #fffff3; } </style> (2)<body style="background-color: #fffff3;">~</body> と両方試してみましたが、背景色が反映されず背景画像のままです。 外部ファイルの body { color : #57450f; background-image : url(image/back01.gif); } 背景画像の部分をはずすと背景色は反映されるんですが、何が問題なのでしょうか? 回答よろしくお願いします。

    • ベストアンサー
    • HTML
  • cssで背景の幅を設定

    cssで背景の幅を設定 GIGAZINE< http://gigazine.net/ >の各タイトル(黄色の背景)のように、文字の背景を一番右までになるように設定するにはcssをどういじればいいのでしょうか コードを読んでみてるのですが、特にかわったことをしている部分を見つけられませんでした 普通にbackground-colorを書くと普通に文字の部分だけに背景色が入ってしまいます

    • ベストアンサー
    • CSS
  • 背景色を指定したのに反映されません。

    CSSは外部ファイルに記述しています。 画像のように色をつけたいのですが、うまくいきません。 上端から150pxです。テキスト・画像を表示しないで背景色のみの表示もできますでしょうか? ・HTML <body>間のみ ※<head>間に<link rel="stylesheet" href="sample.css" type="text/css">の記述はあります。 <body> <div class="color1"><p class>文字など(できれば入れない)</p></div> </body> ・CSS(sample.css) <style type="text/css"> div.color1 { width: 100%; height: 150px; color: black; background-color: blue; } </style> 同じ階層?に両ファイルはあります。

    • ベストアンサー
    • CSS
  • 背景の表示が出来ません。

    ただいまHPを作成中なんですが、背景が表示されなくて困っています。 右下に背景固定して使いたいのですが・・・どう頑張っても表示されません; <HTML> <HEAD> <TITLE>タイトル</TITLE> <style type="text/css"> <!-- body { background-color: #FFFFFF; background-image : url("haikei.png"); background-attachment: fixed; background-position: 100% 100%; background-repeat: no-repeat ; } --> </style> </HEAD> ココに文章 </BODY> </HTML> と言う風になってるんですが、 友人は間違ってないと言っていますが画像は表示されてないようです。 何かおかしな点とかはありますでしょうか。 自分のパソコン内(アップしないでマイコンピュータで見る)でだと普通に表示されています。 アップすると見れなくなるのです。 何故なのでしょうか (既に色々出ていたみたいですがよく解らなかったので^^;)

  • FC2のスタイルシートで背景を変えたい!!!!

    宜しくお願い致します!!! いろいろなサイトでたくさん時間を費やして調べたのですが、 その通りにやってるつもりなのですが、自分の好きな背景に変更できません。+゜(。>д<。)゜+。 背景は body ですよね?? ↓私のCSSの最初の部分↓ /************************************/ /* body */ body{ background-color: #FFFFFF; margin: 0; padding: 0; text-align: center; } #baseBlock { width: 760px; padding: 0px; margin: 0px auto; text-align: left; } ↑ ちなみに、私が入れたい背景は、img6f29afc806ki0s.gif  デス。 今は、背景が白(非常にシンプル)です。 どうか、わかる方、宜しくお願い致します!!!!