html+css

<div id=”momentClock”>
    <div class=”glass”></div>
    <div class=”glass2”></div>
    <div class=”center”></div>
    <div class=”center2”></div>
    <div class=”hour”></div>
    <div class=”minute”></div>
    <div class=”second”></div>
</div>

<div id=”momentClockStr”></div>
<div id=”time2springday”>距离春节还有：<span></span></div>

<style>
#momentClockStr {padding:10px;font-size:1.5em;}
#time2springday {font-size:1.2rem;margin-top: 8px;}
#momentClock {border-radius: 100%;border:solid 10px #000;width:200px;height: 200px;position: relative;visibility: hidden;float:left;margin-right:10px;background: #ccc;box-shadow: 1px 2px 3px #999;}
#momentClock .glass {position: absolute;width: 100%;height: 100%;border-radius: 100%;clip1:rect(0,100px,100px,0px);z-index:1;background-image:linear-gradient(-45deg,rgba(255,255,255,0),rgba(255,255,255,0.3))}
#momentClock .glass2 {position: absolute;width: 170px;height: 170px;border-radius: 100%;background:#ccc;z-index:1;margin-left:25px;margin-top:25px;}
#momentClock .center {position: absolute;left:50%;top:50%;border-radius: 100%;width:10px;height: 10px;background:#333;margin-left:-5px;margin-top:-5px;z-index:4;}
#momentClock .date {position: absolute;left:10px;top:70%;width:100%;height: 20px;margin-left:-5px;margin-top:-5px;z-index:1;text-align: center;}
#momentClock .center2 {position: absolute;left:50%;top:50%;border-radius: 100%;width:20px;height: 20px;background:#ccc;margin-left:-10px;margin-top:-10px;z-index:3;}
#momentClock .hour {position: absolute;width:10px;height:95px;background:red;left:50%;top:5px;margin-left:-5px;z-index:2;-webkit-transform-origin:50% 100%;transform-origin:50% 100%;border-radius:5px;}
#momentClock .minute {position: absolute;width:6px;height:95px;background:green;left:50%;top:5px;margin-left:-3px;z-index:2;-webkit-transform-origin:50% 100%;transform-origin:50% 100%;border-radius:3px;}
#momentClock .second {position: absolute;width:2px;height:95px;background:blue;left:50%;top:5px;margin-left:1px;z-index:2;-webkit-transform-origin:50% 100%;transform-origin:50% 100%;}
</style>

javascript

function momentClock(){
    $(‘#momentClock’).css({visibility:”visible”})
    var now=moment();
    var hour = now.hours();
    var minute = now.minutes();
    var second = now.seconds();
    hour=hour>12?hour-12:hour;
    $(‘#momentClock’).find(‘.hour’).css({transform:’rotate(‘+hour/12360+’deg)’})
    $(‘#momentClock’).find(‘.minute’).css({transform:’rotate(‘+minute/60360+’deg)’})
    $(‘#momentClock’).find(‘.second’).css({transform:’rotate(‘+second/60*360+’deg)’})
    $(‘#momentClockStr’).text(now.format(‘MMMM DD日 YYYY dddd a h:mm:ss’))
}

setInterval(momentClock,1000);

window.onload = function(){
    $(‘#time2springday span’).text(moment([2014, 1, 31]).fromNow());
}