首頁 > web前端 > js教程 > 主體

JS實作瀏覽器狀態列顯示時間的方法

PHPz
發布: 2018-09-28 16:34:56
轉載
2032 人瀏覽過

這篇文章主要介紹了JS實作瀏覽器狀態列顯示時間的方法,涉及JavaScript針對時間及狀態列操作的相關技巧,具有一定參考借鑒價值,需要的朋友可以參考下,具體如下:

以前做個人主頁的時候,總喜歡把自己的網頁搞的很個性,在網上做跑馬燈文字,在狀態欄顯示問候語,或者在狀態欄添加時間顯示,本代碼就是實現了狀態欄顯示目前時間的物資,火狐沒測度,IE下效果完美。

運作效果截圖如下:

線上簡報網址如下:

http://demo.jb51.net/ js/2015/js-status-bar-show-time-demo/

具體程式碼如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>状态栏时间显示</TITLE>
</HEAD>
<script language="JavaScript">
var timerID = null;
var timerRunning = false;
function stopclock (){
  if(timerRunning)
    clearTimeout(timerID);
  timerRunning = false;
}
function showtime () {
  var now = new Date();
  var hours = now.getHours();
  var minutes = now.getMinutes();
  var seconds = now.getSeconds()
  var timeValue = " " + ((hours >12) ? hours -12 :hours)
  timeValue += ((minutes < 10) ? ":0" : ":") + minutes
  timeValue += ((seconds < 10) ? ":0" : ":") + seconds
  timeValue += (hours >= 12) ? " 下午" : " 上午"
  window.status = timeValue;
  timerID = setTimeout("showtime()",1000);
  timerRunning = true;
}
function startclock () {
  stopclock();
  showtime();
}
</script>
<body bgcolor="#336699" topmargin="0" leftmargin="0" onLoad="startclock()">请看左下角!状态栏有时间显示!</BODY>
</HTML>
登入後複製

以上就是本章的全部內容,更多相關教學請訪問JavaScript視訊教學

來源:jb51.net
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板