电子钟到网站

简单的工作电子时钟,可以轻松安装在任何网站上。

如果你尝试,在CSS的帮助下,你可以给他们一个时尚的网站设计外观。

我将给出一个非常短的CSS,以便你有自由创造。

要使时钟工作,您需要将属性onload =“digitalWatch()”添加到body标签。

如果仅在单独的页面上需要时钟(例如,在此处),则将整个代码放置在body标签中。

如果站点的所有页面都需要时钟,脚本将放在head标签中,html将放在body标签中。

脚本:


<script type="text/javascript">
function digitalWatch() {
var date = new Date();
var hours = date.getHours();
var minutes = date.getMinutes();
var seconds = date.getSeconds();
if (hours 10) hours = "0" + hours;
if (minutes 10) minutes = "0" + minutes;
if (seconds 10) seconds = "0" + seconds;
document.getElementById("digital_watch").innerHTML = hours + ":" + minutes + ":" + seconds;
setTimeout("digitalWatch()", 1000);
}
</script">

CSS:


#digital_watch{
letter-spacing: 5px;
color: #777;
font-size: 30px;
border: 2px solid #777;
padding: 10px;
width: 160px;
box-shadow: 1px 1px 3px #BCCCCF,
-1px -1px 2px #BCCCCF;

HTML:


<body onload="digitalWatch()">
<p id="digital_watch"></p>
</body>

И полный код, который можно вставить в Notepad++ для работы со стилями.



<html lang="ru">
<head>
<meta charset="utf-8" />
<title>Часы</title>
<head>
<script type="text/javascript">
function digitalWatch() {
var date = new Date();
var hours = date.getHours();
var minutes = date.getMinutes();
var seconds = date.getSeconds();
if (hours 10) hours = "0" + hours;
if (minutes 10) minutes = "0" + minutes;
if (seconds 10) seconds = "0" + seconds;
document.getElementById("digital_watch").innerHTML = hours + ":" + minutes + ":" + seconds;
setTimeout("digitalWatch()", 1000);
}
</script">

<style>
#digital_watch{
letter-spacing: 5px;
color: #777;
font-size: 30px;
border: 2px solid #777;
padding: 10px;
width: 160px;
box-shadow: 1px 1px 3px #BCCCCF,
-1px -1px 2px #BCCCCF;
}
</style>
</head>

<body onload="digitalWatch()">
<p id="digital_watch"></p>
</body>
</html>

祝你创造性的成功。

Рекомендую: Готовые HTML шаблоны на русском

此条目发表在免费网站脚本分类目录。将固定链接加入收藏夹。
А так же:

发表评论

电子邮件地址不会被公开。 必填项已用*标注