【发布时间】:2013-02-11 20:59:43
【问题描述】:
好的,我遇到了最奇怪的问题。我根据在 codepen 上找到的代码创建了一个代码。它在 Codepen 中完美运行,每小时更换一次图像。我通过更改时钟对其进行了测试。但是,当上传到我的网站时,它不会正确更新。
这是我的本地 html:
<div class="table">
<div id="plate">
<div id="hour1"> </div>
</div>
</div>
css:
html,body { margin:0px; padding:0px; background-color : #fff; }
#plate{
width: 465px;
height: 465px;
background-repeat: no-repeat;
background-image:url(http://www.cassietodd.me/gra423/clockapp/images/Pieclock_plate.png);
}
#hour1{
float:left;
width: 320px;
height: 520px;
background-repeat: no-repeat;
background-image: url(http://www.cassietodd.me/gra423/clockapp/images/strawberry_01.png);
background-size: 104%;
}
.table{
margin: 0px auto;
margin-top: 30px;
width:320px;
height: 568px;
background-image: url(http://www.cassietodd.me/gra423/clockapp/images/Pieclock_table.png);
background-repeat: no-repeat;
}
我的javascript:
window.onload = function () {
var updateView = (function() {
var sec;
return function () {
var now = new Date();
if (now.getSeconds() == sec) return;
var second = now.getSeconds();
var minute = now.getMinutes();
var hour = now.getHours();
var hour1;
if(hour < 12){
hour1 = 0;
}else{
hour1 = Math.floor(hour / 2);
}
var hour1 = hour%12;
_updateView(hour1);
}
})();
setInterval(updateView, 500);
function _updateView(h1) {
var _url = "http://www.cassietodd.me/gra423/clockapp/images/";
$('#hour1').css("background-image", "url("+_url+"h" + h1 + ".png)");
}
}
您可以看到在 Codepen 上运行的那个。 http://codepen.io/cmtodd3/pen/mzibu
它的代码完全相同,但它可以在 codepen 上运行,但在我的网站上,时间都错了?这是我的测试网站以防万一
【问题讨论】:
-
仅供参考 1 小时是一片。因此,如果一个切片缺少它的 1:00
标签: javascript time setinterval clock