- ベストアンサー
ページ更新ごとに４つの画像を時計回りに入れ替える方法
いつも勉強させていただいております。 winXPを使用しております。 ページ更新ごとに４つの画像を時計回りに入れ替える方法を 探しておりまして、皆様のお力をお借りしたく 記入させていただきました。 イメージとしては以下のような感じです。 ┌┐┌┐ └┘└┘ ┌┐┌┐ └┘└┘ 上の絵でわかりますかね？ この４枚がページ更新ごとに 時計回りに入れ替わるようなスクリプトを 探しております。 ４枚がランダムに表示は出来るのですが、 時計回りにというのが出来ずにおります。 なにとぞよろしくお願い申し上げます。
- yajiomaru
- お礼率86% (19/22)
- JavaScript
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
読みこむたびに回転するのであれば、前のページが どういう状態だったのか覚えておく必要があります。 クッキーという仕組みが有効でしょう。 <html> <head> <script language=javascript> function incrementImgCookie(){ val=getImgCookie(); val++ if(val>3) val=0; document.cookie = "img=" + val ; } function getImgCookie(){ ck = document.cookie.split("; "); for (i in ck){ data = ck[i].split("="); if (data[0] == "img"){ val = data[1]; return val; } } return 0; } function loadFunc(){ var val=parseInt(getImgCookie()); var img=new Array() for (var i=0;i<=6;i++){ img[i]=new Image(); } img[0].src="1.jpg" img[1].src="2.jpg" img[2].src="3.jpg" img[3].src="0.jpg" img[4].src="1.jpg" img[5].src="2.jpg" img[6].src="3.jpg" val=3-val; document.images["img0"].src=img[val].src document.images["img1"].src=img[++val].src document.images["img3"].src=img[++val].src document.images["img2"].src=img[++val].src incrementImgCookie(); } </script> </head> <body onLoad="loadFunc()"> <img src="" name="img0"> <img src="" name="img1"><br> <img src="" name="img2"> <img src="" name="img3"> </body> </html>
その他の回答 (1)
- kyofu-chan
- ベストアンサー率23% (109/464)
比較的単純なコーディングで可能ですが、前セッションの引数を直接渡す方法がないので、内部的にカウンタを設置しないといけないでしょうね。カウントの 4 による剰余で判断すればよいと思います。 PHP、CGI、JavaScript、、、どれによるのかを書いておいたほうがよいのでは (JavaScript 以外、使用できる手段の制限があると思うので)。
お礼
kyofu-chanさん、ご連絡ありがとうございます。 Javascriptで行いたいと思っております。 どうかみなさまよろしくお願いいたします。
お礼
yambejpさん、ありがとうございました！できました！ おかげさまで、今日はすっきりサッカーをテレビ観戦できます。 本当に助かりました。 ありがとうございました。