jquery制作LED 時(shí)鐘特效
更新時(shí)間：2015年02月01日 15:46:09 投稿：hebedich
這篇文章主要介紹了jquery制作LED 時(shí)鐘特效,效果非常不錯(cuò)，需要的朋友可以參考下
以下是HTML文件源代碼：
復(fù)制代碼 代碼如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " <html xmlns=" <head>
<title>jQuery模擬LED時(shí)鐘</title>
<script type="text/javascript" src="http://keleyi.com/keleyi/pmedia/jquery/jquery-1.11.0.min.js"></script>
<link rel="Stylesheet" type="text/css" />
<style type="text/css">
div{margin-bottom:10px}
</style>
</head>
<body>
<div><h2>jQuery模擬LED時(shí)鐘</h2></div>
<div id="keleyitime1">2014/4/24 12:38:20</div>
<div id="keleyitime2">2000/1/1 23:59:46</div>
<div id="keleyitime3">1680/12/31 23:59:47</div>
<div id="keleyitime4">2011/3/26 20:18:12</div>
<script type="text/javascript" src="http://keleyi.com/keleyi/phtml/jqtexiao/24/jquery.KeleyiLCDClock.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#ke"+"leyitime4").text(Date());
$("#kele"+"yitime1").KeleyiLCDClock();
$("#keley"+"itime2").KeleyiLCDClock();
$("#kel"+"eyitime3").KeleyiLCDClock();
$("#k"+"eleyitime4").KeleyiLCDClock();
});
</script>
</body>
</html>
使用：
引用jquery.KeleyiLCDClock.css文件和jquery.KeleyiLCDClock.js文件。
然后定義div的id，比如keleyitime，接著設(shè)置時(shí)間與使用KeleyiLCDClock()方法。
$("#keleyitime").text(Date());
$("#keleyitime").KeleyiLCDClock();
以上就是使用jQuery制作LED時(shí)鐘的全部代碼了，希望小伙伴們能夠喜歡。
您可能感興趣的文章:
- jquery+html5時(shí)鐘特效代碼分享（可設(shè)置鬧鐘并且語音提醒）
- jquery+html5制作超酷的圓盤時(shí)鐘表
- jQuery+css實(shí)現(xiàn)的時(shí)鐘效果(兼容各瀏覽器)
- jquery制作圖片時(shí)鐘特效
- jquery模擬LCD 時(shí)鐘的html文件源代碼
- 基于jQuery和CSS3制作數(shù)字時(shí)鐘附源碼下載(jquery篇)
- jQuery超酷平面式時(shí)鐘效果代碼分享
- jQuery CSS3相結(jié)合實(shí)現(xiàn)時(shí)鐘插件
- 基于Jquery和CSS3制作數(shù)字時(shí)鐘附源碼下載(CSS3篇)
- jQuery實(shí)現(xiàn)的電子時(shí)鐘效果完整示例
相關(guān)文章
鼠標(biāo)移到導(dǎo)航當(dāng)前位置的LI變色處于選中狀態(tài)
本文所要實(shí)現(xiàn)的效果廣泛應(yīng)用于當(dāng)前導(dǎo)航,主要表現(xiàn)為鼠標(biāo)移到導(dǎo)航上面當(dāng)前的LI變色，具體實(shí)現(xiàn)如下，感興趣的朋友可以參考下，希望對大家有所幫助2013-08-08
jQuery+CSS3實(shí)現(xiàn)3D立方體旋轉(zhuǎn)效果
這篇文章主要介紹了jQuery結(jié)合CSS3來制作3D立方體旋轉(zhuǎn)效果，切換圖片時(shí)呈現(xiàn)3D立體圖片畫廊特效，需要的朋友可以參考下2015-11-11
這篇文章主要介紹了jquery隔行換色效果實(shí)現(xiàn)方法,涉及even及odd選擇器的使用技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-01-01
下面小編就為大家?guī)硪黄贘query Ajax type的4種類型(詳解)。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-08-08
原來ie對默認(rèn)對彈出窗口有會(huì)限制他的大小和位置 所以這就是為什么本地和博客園上看到會(huì)不一樣的原因了2010-09-09
jquery用get實(shí)現(xiàn)ajax在ie里面刷新不進(jìn)入后臺(tái)解決方法
jquery用get實(shí)現(xiàn)ajax在ie里面刷新不進(jìn)入后臺(tái)的情況想必大家都有遇到過吧，下面與大家分享下具體的解決方法，希望對大家解決問題有所幫助2013-08-08
position()函數(shù)用于返回當(dāng)前匹配元素相對于其被定位的祖輩元素的偏移，也就是相對于被定位的祖輩元素的坐標(biāo)。該函數(shù)只對可見元素有效。2015-07-07
本文將結(jié)合實(shí)際,使用PHP讀取Mysql數(shù)據(jù)表中的數(shù)據(jù),并將獲取的數(shù)據(jù)按照要求輸出給前端JS,再通過配置調(diào)用Highcharts圖表庫生成餅狀圖。2015-05-05
jQuery操作iframe中js函數(shù)的方法小結(jié)
這篇文章主要介紹了jQuery操作iframe中js函數(shù)的方法,結(jié)合實(shí)例形式總結(jié)分析了jQuery操作iframe中的元素、函數(shù)常用方法與注意事項(xiàng),具有一定參考借鑒價(jià)值,需要的朋友可以參考下2016-07-07
jQuery+css實(shí)現(xiàn)圖片滾動(dòng)效果(附源碼)
圖片滾動(dòng)效果想必大家都已司空見慣了吧，接下來本文介紹下jQuery+CSS實(shí)現(xiàn)圖片滾動(dòng)，感興趣的你可不要錯(cuò)過了哈，希望可以幫助到你2013-03-03