suchen

Heim >Web-Frontend >js-Tutorial >JS-Methode zum Implementieren der Anzeigezeit der Browser-Statusleiste

JS-Methode zum Implementieren der Anzeigezeit der Browser-Statusleiste

PHPz
PHPznach vorne
2016-05-16 15:34:542061Durchsuche

In diesem Artikel wird hauptsächlich die JS-Methode zum Implementieren der Zeitanzeige in der Statusleiste des Browsers vorgestellt. Freunde, die sie benötigen, können sich darauf beziehen wie folgt:

Als ich meine persönliche Homepage erstellt habe, habe ich meine Webseite immer sehr personalisiert gestaltet, indem ich Tickertexte im Internet verwendet, Begrüßungen in der Statusleiste angezeigt oder die Zeitanzeige im Status hinzugefügt habe bar. Dieser Code implementiert den Status. Die Spalte zeigt die Materialien zum aktuellen Zeitpunkt nicht an, aber der Effekt ist unter IE perfekt.

Ein Screenshot des Laufeffekts lautet wie folgt:

Die Online-Demo-Adresse lautet wie folgt:

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

Der spezifische Code lautet wie folgt: 

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

Der Oben finden Sie den gesamten Inhalt dieses Kapitels. Weitere verwandte Tutorials finden Sie unter JavaScript-Video-Tutorial!

Stellungnahme：
Dieser Artikel ist reproduziert unter:jb51.net. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen
Vorheriger Artikel：Dynamischer Return-to-Top-Spezialeffektcode, implementiert von jquery_jqueryNächster Artikel：Dynamischer Return-to-Top-Spezialeffektcode, implementiert von jquery_jquery

In Verbindung stehende Artikel

Mehr sehen