JS实现浏览器状态栏显示时间的方法


Posted in Javascript onOctober 27, 2015

本文实例讲述了JS实现浏览器状态栏显示时间的方法。分享给大家供大家参考,具体如下:

以前做个人主页的时候,总喜欢把自己的网页搞的很个性,在网上做跑马灯文字,在状态栏显示问候语,或者在状态栏添加时间显示,本代码就是实现了状态栏显示当前时间的物资,火狐没测度,IE下效果完美。

运行效果截图如下:

JS实现浏览器状态栏显示时间的方法

在线演示地址如下:

具体代码如下:

<!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程序设计有所帮助。

Javascript 相关文章推荐
JMenuTab简单使用说明
Mar 13 Javascript
javascript学习笔记(二) js一些基本概念
Jun 18 Javascript
JQuery动画和停止动画实例代码
Mar 01 Javascript
js获取Get值的方法
Sep 29 Javascript
JS中正则表达式全局匹配模式 /g用法详解
Apr 01 Javascript
ES6学习笔记之正则表达式和字符串正则方法分析
Apr 25 Javascript
vue2.0 与 bootstrap datetimepicker的结合使用实例
May 22 Javascript
vue-cli配置环境变量的方法
Jul 09 Javascript
微信小程序 Animation实现图片旋转动画示例
Aug 22 Javascript
jQuery实现数字自动增加或者减少的动画效果示例
Dec 11 jQuery
详解webpack 最简打包结果分析
Feb 20 Javascript
详解vue中router-link标签所必备了解的属性
Apr 15 Javascript
JavaScript模块规范之AMD规范和CMD规范
Oct 27 #Javascript
JS实现浏览器状态栏文字从右向左弹出效果代码
Oct 27 #Javascript
jQuery无刷新分页完整实例代码
Oct 27 #Javascript
js数组如何添加json数据及js数组与json的区别
Oct 27 #Javascript
基于jquery实现鼠标滚轮驱动的图片切换效果
Oct 26 #Javascript
JavaScript编程中window的location与history对象详解
Oct 26 #Javascript
jquery移动端TAB触屏切换实现效果
Dec 22 #Javascript
You might like
详解PHP内置访问资源的超时时间 time_out file_get_contents read_file
2013/06/03 PHP
php判断页面是否是微信打开的示例(微信打开网页)
2014/04/25 PHP
qq登录,新浪微博登录接口申请过程中遇到的问题
2014/07/22 PHP
php页面缓存方法小结
2015/01/10 PHP
php语言中使用json的技巧及json的实现代码详解
2015/10/27 PHP
PHP入门教程之使用Mysqli操作数据库的方法(连接,查询,事务回滚等)
2016/09/11 PHP
php基于curl实现随机ip地址抓取内容的方法
2016/10/11 PHP
php web环境和命令行环境下查找php.ini的位置
2019/07/17 PHP
jQuery Ajax 实例全解析
2011/04/20 Javascript
理清apply(),call()的区别和关系
2011/08/14 Javascript
js写的方法实现上传图片之后查看大图
2014/03/05 Javascript
js函数模拟显示桌面.scf程序示例
2014/04/20 Javascript
alert出数组中的随即值代码
2014/09/25 Javascript
jQuery插件Slider Revolution实现响应动画滑动图片切换效果
2015/06/05 Javascript
使用JavaScript实现旋转的彩圈特效
2015/06/23 Javascript
AngularJS下对数组的对比分析
2016/08/24 Javascript
微信小程序 for 循环详解
2016/10/09 Javascript
Angular学习笔记之angular的$filter服务浅析
2016/11/12 Javascript
Bootstrap table两种分页示例
2016/12/23 Javascript
JS正则匹配URL网址的方法(可匹配www,http开头的一切网址)
2017/01/06 Javascript
jQuery模拟实现天猫购物车动画效果实例代码
2017/05/25 jQuery
JavaScript之class继承_动力节点Java学院整理
2017/07/03 Javascript
详解wepy开发小程序踩过的坑(小结)
2019/05/22 Javascript
vue中的 $slot 获取插槽的节点实例
2019/11/12 Javascript
js中switch语句的学习笔记
2020/03/25 Javascript
关于你不想知道的所有Python3 unicode特性
2014/11/28 Python
通过python顺序修改文件名字的方法
2018/07/11 Python
python2与python3中关于对NaN类型数据的判断和转换方法
2018/10/30 Python
python笔记_将循环内容在一行输出的方法
2019/08/08 Python
Python 中的 import 机制之实现远程导入模块
2019/10/29 Python
基于html和CSS3制作酷炫的导航栏
2015/09/23 HTML / CSS
Footshop乌克兰:运动鞋的最大选择
2019/12/01 全球购物
写好自荐信的几个要点
2013/12/26 职场文书
单位提档介绍信
2014/01/17 职场文书
商场促销活动总结
2014/07/10 职场文书
六一文艺汇演主持词
2015/06/30 职场文书