首页 > 编程 > JavaScript > 正文

jQuery CSS3相结合实现时钟插件

2019-11-20 10:50:00
字体:
来源:转载
供稿:网友

废话不多说了,直接给大家贴代码了。

效果图如下所示:

 

简洁代码如下:

<link rel="stylesheet" href="http://hovertree.com/texiao/hoverclock/jquery.hoverclock.2.1.0.css" /><script src="http://hovertree.com/ziyuan/jquery/jquery-2.1.4.min.js"></script><script src="http://hovertree.com/texiao/hoverclock/jquery.hoverclock.2.1.0.js"></script><div id="hoverclock"></div><script>$("#hoverclock").hoverclock({"h_width":500,"h_height":500,//"h_hourNumSize": "80",// "h_hourNumRadii": "200",// "h_hourNumShow": false,// "h_minuteNumShow":false,"h_hourNumColor": "deeppink","h_backColor": "yellow",// "h_borderColor": "gold",//"h_frontColor":"red","h_linkText": "HoverClock"});</script> 

完整代码如下:

<!DOCTYPE html><html><head><meta charset="UTF-8"><link rel="stylesheet" href="http://hovertree.com/texiao/hoverclock/jquery.hoverclock.2.1.0.css" /><script src="http://hovertree.com/ziyuan/jquery/jquery-1.11.3.min.js"></script><style>body {margin: 0px;padding: 0px;}div {padding: 0px;}</style><meta name="viewport" content="width=device-width, initial-scale=1" /><title>HoverClock - HoverTree</title><base target="_blank" /></head><body><div style="width:500px;margin:10px auto;"><div id="hoverclock"></div><div><br /><a href="http://hovertree.com/h/bjaf/hoverclock.htm">Help</a> <a href="http://hovertree.com/texiao/hoverclock/">Demo 1</a> <a href="http://hovertree.com/texiao/hoverclock/demo2.htm">Demo 2</a><a href="http://hovertree.com/texiao/hoverclock/demo3.htm">Demo 3</a> <a href="http://hovertree.com/texiao/hoverclock/demo4.htm">Demo 4</a></div></div><script src="http://hovertree.com/texiao/hoverclock/jquery.hoverclock.2.1.0.js"></script><script>$("#hoverclock").hoverclock({"h_width":500,"h_height":500,//"h_hourNumSize": "80",// "h_hourNumRadii": "200",// "h_hourNumShow": false,// "h_minuteNumShow":false,"h_hourNumColor": "deeppink","h_backColor": "yellow",// "h_borderColor": "gold",//"h_frontColor":"red","h_linkText": "HoverClock"});</script></body></html>

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表