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

質問

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

回答No.2

yambejp · ベストアンサー

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

<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>

＞カウントの部分が３秒刻みなのでしょうか？

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

お礼

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

回答No.1

yambejp

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

<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>

補足

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