WEB相談室

Webページ作成に関しての何でも掲示板です。

タイトル:アクセスするたびに壁紙を変えたい

あゆ[MAIL][URL][WriteDate : Tue Aug 15 21:57:43 2000]

HPに来るたびに壁紙が変わるようにしたいと思っていろいろ探していて、
背景色を変えるというのがあったので
それを参考にしてやってみたのですが、うまくできませんでした。

参考にしたのはこれです。

<HTML>
<HEAD>
<TITLE>ページ読み込み時に背景色をランダムに変更</TITLE>
</HEAD>
<BODY>
<SCRIPT language="JavaScript">
<!--
colors=new Array(10);
colors[0]="yellow";
colors[1]="red";
colors[2]="blue";
colors[3]="green";
colors[4]="black";
colors[5]="brown";
colors[6]="gray";
colors[7]="orange";
colors[8]="purple";
colors[9]="white";
index=Math.floor(10*Math.random());
document.bgColor=colors[index];
// -->
</SCRIPT>
<CENTER>
何度かリロードしてみてください。
</CENTER>
</BODY>
</HTML>

そして、フレームを使用しているので、
フレーム1とフレーム2の壁紙が違ったものにならないようにする方法も教えていただけないでしょうか?

宜しくお願いします。

Qz[MAIL][URL][WriteDate :Wed Aug 16 04:44:31 2000]


>HPに来るたびに壁紙が変わるようにしたいと思っていろいろ探していて、 

bgColorは、背景色の変更しかできません。
壁紙の場合は、document.body.style.backgroundImageというのを使います。
例)
document.body.style.backgroundImage = "url(./pics/back.gif)";

>フレーム1とフレーム2の壁紙が違ったものにならないようにする方法も教えていただけないでしょうか? 

<frameset rows="150,*">
<frame src = "a.html" name="up" margeinwidth=0>
<frame src = "b.html" name="down" margeinwidth=0>
</frameset>

とあったとして、上か、または、下のフレームで、

<SCRIPT language="JavaScript">
<!--
bg=new Array();
var i = new Number(0);
bg[i++] = './pics/kabe01.gif';
bg[i++] = './pics/kabe02.gif';
bg[i++] = './pics/kabe03.gif';
bg[i++] = './pics/kabe04.gif';
var index=Math.floor(bg.length * Math.random());
document.body.style.backgroundImage = "url(" + bg[index] + ")"
parent.down.document.body.style.backgroundImage = "url(" + bg[index] + ")"
// -->
</SCRIPT>

かな。
メニュー側じゃないほうのページにいれるのがいいとおもいます。
でも、毎回、壁紙かわりそうだけど(笑)
あと、メンテナンスがたいへん。

メニュー側にいれると、メニュー側じゃないほうの壁紙は、変更されないでしょうし・・・
メニューの各ボタンをクリックされたときに、本文(?)の壁紙を変更する方法もあるでしょうけれど、あまり精度がよくならないような気もします。

あ、でも、最初の方法でも、スクリプトエラーでることあるかも・・
フレーム間の制御は、ちょっと、厄介(笑)
軽い時間帯なら、問題ないとは思いますけどね。
壁紙の変更程度なら、大丈夫かな・・・


あゆ[MAIL][URL][WriteDate :Wed Aug 16 14:19:39 2000]

Qzさん、ありがとうございます。

さっそくやってみたのですが
「オブジェクトがありません」と

parent.down.document.body.style.backgroundImage = "url(" + bg[index] + ")" 

ここ(↑)にエラーが出て、
スクリプトを入れていない方の壁紙は10回に1回くらいしか出ないんです。
出た時は2つとも同じ壁紙が出るのですが。

やっぱり諦めたほうがいいのでしょうか?

Qz[MAIL][URL][WriteDate :Thu Aug 17 23:26:12 2000]

フレームのソースの

<frame src = "a.html" name="up" margeinwidth=0> 
<frame src = "b.html" name="down" margeinwidth=0> 

のNameのdownと、

parent.down.document・・・

parentのつぎのdownは、同じ名前です
もし、フレームのソースのnameが、abcとかだったら、
parent.abc.document・・・となります。

そーなってますか?


あゆ[MAIL][URL][WriteDate :Fri Aug 18 12:21:01 2000]

はい。
そこはちゃんと変えたんですけど、
エラーが出たり、背景が出なかったりするんです。

ここです。
http://www.geocities.co.jp/Hollywood-Stage/6655/frame.html

どこか間違っているところがあるのでしょうか?
Qzさんが書いてくださったものをそのままコピーして使ったのですが・・・

ちゃいぱ[MAIL][URL][WriteDate :Fri Aug 18 22:31:30 2000]

よこから、失礼します。
>フレーム間の制御は、ちょっと、厄介(笑) 
>軽い時間帯なら、問題ないとは思いますけどね。 
私もロジック的でなく、タイミングの問題のような気がします。
フレームが存在する前に、そのフレームのオブジェクトを指定してしまうのでないでしょうか?
(実際、frame4からframe6のオブジェクトを指定していすね。ロジック的には問題ないですが、タイミング的には...。)
私なりに回避策を調べてみます。
また、Qzさんの回答にも期待します。




Qz[MAIL][URL][WriteDate :Sat Aug 19 05:09:09 2000]

原因はよくわかりませんが、BODY句に onLoadイベントを利用するというのもあります。
HEAD部に前述のコードを関数化して、onLoadイベントで、その関数をよびだすようにしたら、どうでしょう?

<HEAD>
<TITLE>title</HEAD>
<SCRIPT language="JavaScript"> 
<!-- 
function ChangeBackGround(){
bg=new Array(); 
var i = new Number(0); 
bg[i++] = './pics/kabe01.gif'; 
bg[i++] = './pics/kabe02.gif'; 
bg[i++] = './pics/kabe03.gif'; 
bg[i++] = './pics/kabe04.gif'; 
var index=Math.floor(bg.length * Math.random()); 
document.body.style.backgroundImage = "url(" + bg[index] + ")" 
parent.down.document.body.style.backgroundImage = "url(" + bg[index] + ")" 
}
// --> 
</SCRIPT> 
</HEAD>
<BODY onLoad="ChangeBackGround()">

あとは、JavaScriptのコードを、一番下にかくとか・・・
frameのソースが読み終わったかどうかチェックする関数は、ないのかなあ(^^;;

CGIが使えれば、CGIでページを書く手もありますが・・・

Qz[MAIL][URL][WriteDate :Sat Aug 19 05:24:31 2000]

あとは、フレームのトップで、壁紙を決定しておき、
各フレーム内では、トップのフレームで決定した壁紙にしていくというのも、あると思います。

--Frameのhead部に以下を記述
<head>
<title>TITLE</title>
<SCRIPT language="JavaScript">
<!--
bg=new Array();
var i = new Number(0);
bg[i++] = './pics/kabe01.gif';
bg[i++] = './pics/kabe02.gif';
bg[i++] = './pics/kabe03.gif';
bg[i++] = './pics/kabe04.gif';
var index=Math.floor(bg.length * Math.random());
var back = bg[index];
// -->
</SCRIPT>
</head>

--各ページのソースではBODY部(HEAD部にかいても大丈夫かもしれないし、だめかもしれない)で、以下を記述

<SCRIPT language="JavaScript">
<!--
document.body.style.backgroundImage = "url(" + parent.back + ")"
// -->
</SCRIPT>

これで、リロードの度、背景画像が変わります

ちゃいぱ[MAIL][URL][WriteDate :Sat Aug 19 08:45:22 2000]


>frameのソースが読み終わったかどうかチェックする関数は、ないのかなあ(^^;;

ちょっと、Mugiさんに聞いてみました。

if(他フレームオブジェクト){  //frameのソースが読み終わったか
   他フレームオブジェクト操作 //frameのソースが読み終わった
}
でいけるみたいです。
これに、setTimeoutをかまして、 

var tID;
function set_other_obj(){
   tID = setTimeout("set_other_obj()", 1000);
   if(フレームオブジェクト){  //frameのソースが読み終わったか
      フレームオブジェクト操作 //frameのソースが読み終わった
      clearTimeout(tID);   
   }
}

しかし、
>あとは、フレームのトップで、壁紙を決定しておき、....,
私もこの方法が、シンプルでいいと思います。 



あゆ[MAIL][URL][WriteDate :Sat Aug 19 11:58:56 2000]

いろいろ考えていただいて、ありがとうございました。

フレームのトップで壁紙を決定する方法で上手くいき、
こんな感じになりました。http://www.jttk.zaq.ne.jp/ayu/frame2.html

本当にありがとうございました!

回答(必須): 状態:

お名前(必須):

e-mail:

URL:




[戻る]