jquery模拟LCD 时钟的html文件源代码

前端技术 2023/09/03 JavaScript
以下是HTML文件源代码:
复制代码 代码如下:

<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">
<html xmlns=\"http://www.w3.org/1999/xhtml\">
<head>
<title>jQuery模拟LCD时钟</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\" href=\"http://keleyi.com/keleyi/phtml/jqtexiao/24/jquery.KeleyiLCDClock.css\" />
<style type=\"text/css\">
div{margin-bottom:10px}
</style>
</head>
<body>
<div><h2>jQuery模拟LCD时钟</h2><a href=\"http://keleyi.com/a/bjad/l3u8rpcb.htm\" target=\"_blank\">原文</a>
</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,接着设置时间与使用KeleyiLCDClock()方法。
$(\"#keleyitime\").text(Date());
$(\"#keleyitime\").KeleyiLCDClock();

本文地址:https://www.stayed.cn/item/7134

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见,何事秋风悲画扇。