jQuery+css实现的时钟效果(兼容各浏览器)_jquery
程序员文章站
2022-04-04 11:20:04
...
本文实例讲述了jQuery+css实现的时钟效果。分享给大家供大家参考，具体如下：
');
wrapper.append(minute.join(''));
}
function createHour(po, r, text) {
var minute = [];
minute.push('
运行效果截图如下：
这里没有做太多的修饰，简单的实现了一下功能，另外，用的是js的setTimeout方法，当时间长了之后，会有一定的延时，建议，在每隔多少分钟执行一次时钟校准！哈哈，都有误差的嘛，反正我是没给你校。
具体代码如下：
');
minute.push(text);
minute.push('
');
wrapper.append(minute.join(''));
}
function initSeconds(text, center, range) {
var now_seconds = new Date().getSeconds();
now_seconds = now_seconds > 0 ? now_seconds - 1 : 0;
for (var i = 0; i 0 ? Math.floor((index % 60)) + 1 : 0;
wrapper.find(".minute:lt(" + index + ")").css('color', "green");
if (index > 0) {
wrapper.find(".minute:eq(0)").css('color', '#DDDDDD');
}
}
function waldedHour(index) {
var index = Math.floor((index%12)) > 0 ? Math.floor((index%12)) + 1:0;
wrapper.find(".hour:lt(" + index + ")").css('color', "green");
if(index > 0) {
wrapper.find(".hour:eq(0)").css('color', '#494949');
}
}
function animation(obj, r, radian, range, center, text, last) {
logNowTime();
radian += addRadian;
var x = center.x - Math.cos(radian) * r;
var y = center.y - Math.sin(radian) * r;
obj.css({ "left": x, "top": y });
if (last && radian > Math.PI * 5 / 2 - 0.1) {
radian = Math.PI / 2;
minutes++;
if (minutes ' : 'color:red;" >');
flower.push(text);
flower.push('