みんなの「教えて(疑問・質問)」にみんなで「答える」Q&Aコミュニティ

こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

解決済みの質問

インラインフレーム内に決められた秒数毎に…

インラインフレーム内に決められた秒数毎に、自動的にアクセスして別のページに変わるようにしたいのですが、ソースを教えていただけないでしょうか?
具体的に言いますと、
インラインフレーム内に3秒ごとに最初はサイトAまた3秒たったら次はサイトBまた3秒たったら次はサイトC…と続くようにしたいです。可能なら最後までいったら最初に戻るのではなく止まるとありがたいです(これは無理でしたら諦めます)
押したら3秒で切り替えが始まるようにボタンでON・OFF制御できて何回フレーム内のページが変わったかカウントしてくれる表示が付きましたらうれしいです。
可能な限りでいいのでソースの方よろしくお願いします。

投稿日時 - 2012-03-25 01:38:42

QNo.7382253

すぐに回答ほしいです

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

一部バグがあったので修正しました

<script>
var urls=[
"http://www.yahoo.co.jp"
,"http://www.yomiuri.co.jp"
,"http://mainichi.jp"
,"http://www.asahi.com"
];
var timerFlg=true;
var timerID=0;
function func(f){
var e=f.elements["count"];
document.getElementById("i").src=urls[e.value];
e.value++;
if(timerFlg){
timerID=setInterval(function(){
if(e.value>=urls.length){
clearInterval(timerID);
return false;
}
document.getElementById("i").src=urls[e.value];
e.value++;
},3000);
}else{
clearInterval(timerID);
}
timerFlg=!timerFlg;
}
</script>
<form>
<input type="text" value="0" name="count">
<input type="button" value="go" onclick="func(this.form)">
</form>
<iframe src="" id="i" width=100% height=200></iframe>


>カウントの部分が3秒刻みなのでしょうか?

setInterval()に3000ミリ秒を指定しているので3秒ごとに切り替わります
ただし、表示してから3秒ではなく、3秒刻みで処理をしているだけなので
重いページだと表示される前に次のページに行ってしまう可能性はあります

投稿日時 - 2012-03-26 12:58:27

お礼

ありがとうございます^^
だいぶいい感じです

投稿日時 - 2012-03-26 19:37:21

ANo.2

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

回答(2)

ANo.1

いろいろやりようはありそうですが、ざっくりこんな感じでしょうか?

<script>
var urls=[
"http://www.yahoo.co.jp"
,"http://www.yomiuri.co.jp"
,"http://mainichi.jp"
,"http://www.asahi.com"
];
var timerFlg=true;
var timerID=0;
function func(f){
var e=f.elements["count"];
document.getElementById("i").src=urls[e.value];
if(timerFlg){
timerID=setInterval(function(){
e.value++;
if(e.value>=urls.length){
return false;
}
document.getElementById("i").src=urls[e.value];
},3000);
}else{
clearInterval(timerID);
}
timerFlg=!timerFlg;
}
</script>
<form>
<input type="text" value="0" name="count">
<input type="button" value="go" onclick="func(this.form)">
</form>
<iframe src="" id="i" width=100% height=200></iframe>

投稿日時 - 2012-03-26 01:46:37

補足

ありがとうございます^^
だいたいこれでいいのですがカウントの部分が3秒刻みなのでしょうか?
アクセスが最後までいって止まってもそちらだけ動き続けてるのがどうにかならないでしょうか?

投稿日時 - 2012-03-26 10:44:38

あなたにオススメの質問