※ ChatGPTを利用し、要約された質問です（原文：1分毎にHTMLを切り替えるJavaScript）
1分ごとにHTMLを切り替えるJavaScript
このQ&Aのポイント
上記のJavaScriptは、1分ごとに画像を切り替える機能を持っています。
しかし、画像ではなく、インフレームでHTMLを表示するためのコードに変更したいと思いますが、上手く動作しません。
アプデートしている関数内のコードを変更することで、要件を満たす方法を見つけたいです。
<script>
function getImageFile(date){
var dir = 'min_img/';
var ext = 'jpg';
var hour = date.getHours();
if(hour < 10){
hour = '0' + hour;
}
var minute = date.getMinutes();
if(minute < 10){
minute = '0' + minute;
}
return dir + hour + minute + '.' + ext;
}
function updateClock(){
var date = new Date();
var image = getImageFile(date);
date.setTime(date.getTime() + 60 * 1000);
var next_image = getImageFile(date);
$('#clock').fadeOut(1000, function(){
$('#clock')
.html('<img src="' + image + '"><img src="' + next_image + '" style="display:none;">')
.fadeIn(1000);
});
setTimeout('updateClock()', 60 * 1000);
}
$(document).ready(function(){
updateClock();
});
</script>
<body>
<div id="clock"></div>
</body>
上記のJavaScriptは1分毎に画像が切り替えるものです。
画像でなく、インフレームでHTMLを表示したいのですが、うまくいきません。
<script>
function getImageFile(date){
var dir = 'html/';
var ext = 'html';
var hour = date.getHours();
if(hour < 10){
hour = '0' + hour;
}
var minute = date.getMinutes();
if(minute < 10){
minute = '0' + minute;
}
return dir + hour + minute + '.' + ext;
}
function updateClock(){
var date = new Date();
var image = getImageFile(date);
date.setTime(date.getTime() + 60 * 1000);
var next_image = getImageFile(date);
$('#clock').fadeOut(1000, function(){
$('#clock')
.html('<a href="' + image + '"></a><a href="' + next_image + '" style="display:none;"></a>')
.fadeIn(1000);
});
setTimeout('updateClock()', 60 * 1000);
}
$(document).ready(function(){
updateClock();
});
</script>
<body>
<iframe id="clock"></a></iframe>
</body>
宜しくお願いします。
