Home > Article > Web Front-end > JS method to implement browser status bar display time

JS method to implement browser status bar display time

PHPzforward: 2016-05-16 15:34:542008browse

This article mainly introduces the JS method to implement the time display in the browser status bar, involving JavaScript related skills for time and status bar operations. It has certain reference value. Friends who need it can refer to it. The details are as follows:

When I used to make my personal homepage, I always liked to make my webpage very personalized. I used ticker text on the Internet, displayed greetings in the status bar, or added time display in the status bar. This code implements the status The column displays the materials at the current time. Firefox does not detect it, but the effect is perfect under IE.

A screenshot of the running effect is as follows:

The online demo address is as follows:

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

The specific code is as follows:

<!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>

The above is the entire content of this chapter. For more related tutorials, please Visit JavaScript Video Tutorial!

Statement：

This article is reproduced at:jb51.net. If there is any infringement, please contact admin@php.cn delete

Previous article：Dynamic return to top special effects code implemented by jquery_jqueryNext article：Dynamic return to top special effects code implemented by jquery_jquery

See more

JS method to implement browser status bar display time

Related articles