javascript - 将时钟上弦至当前时间

Question

我用 javascript、css 制作了一个模拟风格的时钟。

function updateClock() {
    var now = moment(),
        second = now.seconds() * 6, 
        minute = now.minutes() * 6, 
        hour = now.hours() % 12 / 12 * 360 + 90 + minute / 12;

    document.getElementById("hour").style.transform = 'rotate(' + hour + 'deg)';
    document.getElementById("minute").style.transform = 'rotate(' + minute + 'deg)';
}

function timedUpdate() {
    updateClock();
    setTimeout(timedUpdate, 1000);
}

timedUpdate();

我想添加一个结束效果，所以在页面加载时时钟从 12:00 开始并动画/结束到当前时间(有点像这里的时钟:http://www.apple.com/uk/macbook-air/)

Here's the Fiddle

Answer 1

您看来我们只是缺少 CSS 转换。

-webkit-transtition: 0.5s all

它将旋转超过 0.5 秒。我已经使用 webkit 前缀将它添加到您的 fiddle 中:

https://jsfiddle.net/pw8bfjq2/1/