jquery模拟LCD 时钟的html文件源代码
更新时间：2014年06月16日 15:25:05 投稿：whsnow
LCD想必大家都有见到过吧，本文为大家介绍的就是使用jquery模拟LCD时钟，以下是HTML文件源代码
以下是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();
复制代码 代码如下:
<!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();
相关文章
jQuery判断iframe中元素是否存在的方法，需要的朋友可以参考一下2013-05-05
这篇文章主要介绍了jQuery中replaceAll()方法用法,实例分析了replaceAll()方法的功能、定义及匹配元素去替换指定内容的方法,需要的朋友可以参考下2015-01-01
这篇文章主要介绍了基于JQuery实现分隔条的功能的相关资料，使用JQuery技术实现分隔条的功能，感兴趣的小伙伴们可以参考一下2016-06-06
元素选择是一切操作的前提，jQuery中$()函数最强大最常用的功能之一就是使用选择器选择DOM元素。这里就汇总一些十分常用的jQuery选择器。2017-02-02
jQuery 定时局部刷新(setInterval),这里是显示时间的效果代码。2010-11-11
本文介绍下，用jquery实现的滑动效果，以及对键盘按键进行监听的例子，有需要的朋友，可以参考学习下2014-05-05
这篇文章主要介绍了jQuery中insertBefore()方法用法,实例分析了insertBefore()方法的功能、定义及把匹配的元素插入到另一个指定的元素集合前面的使用技巧,需要的朋友可以参考下2015-01-01
下面小编就为大家带来一篇jquery获取复选框的值的简单实例。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-05-05
给指定id或class的元素绑定（bind）事件时，对于改变或新加的元素，事件不会起作用，这时我们就要用live函数，它可以让子元素继承父元素的事件。2010-12-12
这篇文章主要介绍了JQuery中使文本框获得焦点的方法,实例分析了jQuery针对文本框获得焦点的技巧,需要的朋友可以参考下2015-02-02
最新评论