HTML JS文字闪烁实现(项目top.htm分析)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<!-- saved from url=(0033)https://192.168.1.2/topframe6.htm -->
<HTML><HEAD><TITLE>topframe</TITLE>
<META http-equiv=Content-Type content="text/html; charset=utf-8">
<link href="css/base.css" rel="stylesheet" type="text/css"> <SCRIPT language=JavaScript>
var currentid = "c1";
function openurl2(newid, url1, url2)
{
document.getElementById(currentid).className = "";
document.getElementById(newid).className = "current";
currentid = newid; window.parent.document.getElementById("menu").src = url1;
window.parent.document.getElementById("content").src = url2;
} function myrefresh()
{
window.parent.frames["topframe"].location.reload();
}
setTimeout('myrefresh()',600000); function blink (err_id) {
var code = '';
var speed = 500; code += 'var el = document.getElementById("' + err_id + '");';
code += 'el.style.visibility = ' + 'el.style.visibility == "hidden" ? "visible" : "hidden"'; var interval=setInterval(code,speed);
var desc_id=document.getElementById("desc_err");
desc_id.onmouseover=function(){clearInterval(interval)}
desc_id.onmouseout=function(){interval=setInterval(code,speed)}
}
function stateOnload() {
blink('desc_err');
}
</SCRIPT>
</HEAD> <BODY ONLOAD="stateOnload()" style="padding:0px">
<div id="top">
<div id="logo"></div>
<div>
<div id="list">
<UL>
<LI id=c1 class=current>
<A href="javascript:openurl2('c1', '/View/menu', '/undefined')">查看</A>
</LI>
<LI id=c2><A href="javascript:openurl2('c2', '/Manage/menu', '/undefined')">管理</A></LI>
<LI id=c3><A href="javascript:openurl2('c3', '/Maintain/menu', '/undefined')">维护</A></LI>
</UL>
</div>
{% module Workstate() %}
//<div id="desc_err"><A href="javascript:openurl2(\'c1\', \'/View/menu\', \'/View/faultyinfo\')">工作故障</A></div>
</div>
</div> </BODY>
</HTML>
上述代码说明:
1.function myrefresh():实现定时刷新top.htm页面
window.parent.frames["topframe"].location.reload();
2.function blink (err_id):实现字体闪烁
desc_id.onmouseover=function(){clearInterval(interval)} --鼠标位于字体上时,停止闪烁,以便点击进行超链接
desc_id.onmouseout=function(){interval=setInterval(code,speed)} --鼠标离开字体上时,继续闪烁
3.代码第56行{% module Workstate() %}
实际代码为:<div id="desc_err"><A href="javascript:openurl2(\'c1\', \'/View/menu\', \'/View/faultyinfo\')">工作故障</A></div>
当点击字体之后连接到/View/faultyinfo,通过JS函数function openurl2(newid, url1, url2)将整个页面的几个框架(FRAME)分别进行链接
4.setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式。
提示:setTimeout() 只执行 code 一次。如果要多次调用,请使用 setInterval() 或者让 code 自身再次调用 setTimeout()。
简单示例:
<html>
<head>
<script type="text/javascript">
var c=0
var t
function timedCount()
{
document.getElementById('txt').value=c
c=c+1
t=setTimeout("timedCount()",1000)
}
</script>
</head> <body>
<form>
<input type="button" value="开始计时!" onClick="timedCount()">
<input type="text" id="txt">
</form>
<p>请点击上面的按钮。输入框会从 0 开始一直进行计时。</p>
</body> </html>
5.setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式。
setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。
简单示例:
<html>
<body> <input type="text" id="clock" size="35" />
<script language=javascript>
var int=self.setInterval("clock()",50)
function clock()
{
var t=new Date()
document.getElementById("clock").value=t
}
</script>
<button onclick="int=window.clearInterval(int)">Stop interval</button> </body>
</html>
PS:
起初实现文字闪烁代码如下:
function blink (elId) {
var html = '';
if (document.all)
html += 'var el = document.all.' + elId + ';';
else if (document.getElementById)
html += 'var el = document.getElementById("' + elId + '");';
html += 'el.style.visibility = ' + 'el.style.visibility == "hidden" ? "visible" : "hidden"';
if (document.all || document.getElementById)
setInterval(html, 500)
}
1.document.all是页面内所有元素的一个集合。例如:document.all(0)表示页面内第一个元素
2.document.all可以判断浏览器是否是IE
if(document.all){
alert("is IE!");
}
3.可以通过给某个元素设置id属性(id=aaaa),然后用document.all.aaaa调用该元素
综上:
当在IE浏览器执行时进入 :if (document.all)
当在其他浏览器执行时进入:else if (document.getElementById)
这里舍弃document.all,直接使用document.getElementById
HTML JS文字闪烁实现(项目top.htm分析)的更多相关文章
- js文字颜色闪烁
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 【android】TabLayout文字闪烁问题
安卓MD设计提供了一个非常酷炫的效果,TabLayout拿来做选项卡时非常合适的,但是在实际使用中发现22.2.1版本号的TabLayout在ViewPager滑动的时候会出现闪烁现象. 解决方法:在 ...
- js文字向上滚动代码
js文字向上滚动代码 <style>.pczt_pingfen_jhxs_news1{ width:397px; background:#edfafd; padding-top:2px; ...
- 利用JS实现闪烁字体
以下为在JSP文件中,利用JS实现闪烁字体的代码: HTML代码: <div id="blink">一段会闪烁的字</div> JavaScript代码: ...
- .NET开源项目 TOP 25
.NET开源项目 TOP 25 如果知道.NET项目在开源中国的git上所占的比重只有5%的话,为什么这个<2014年国人开发的最热门的开源软件TOP 100>榜中.NET项目那么少就是情 ...
- js文字展示各种滚动效果
js文字展示各种滚动效果:http://www.dowebok.com/demo/188/
- Vue.js开始第一个项目
前端架构之路:使用Vue.js开始第一个项目 Vue.js做为目前前端最热门的库之一,为快速构建并开发前端项目多了一种思维模式.本文通过一个简单的实例开始上手Vue.js开发. 一.技术准备 使用 ...
- 新建一个基于vue.js+Mint UI的项目
上篇文章里面讲到如何新建一个基于vue,js的项目(详细文章请戳用Vue创建一个新的项目). 该项目如果需要组件等都需要自己去写,今天就学习一下如何新建一个基于vue.js+Mint UI的项目,直接 ...
- Node.js 实战 & 最佳 Express 项目架构
Node.js 实战 & 最佳 Express 项目架构 Express Koa refs https://github.com/xgqfrms/learn-node.js-by-practi ...
随机推荐
- Maven面试宝典
一.Maven有哪些优点和缺点 优点如下: 简化了项目依赖管理: 易于上手,对于新手可能一个"mvn clean package"命令就可能满足他的工作 便于与持续集成工具(jen ...
- [C/C++] char data[0](柔性数组)
转自:http://blog.csdn.net/yby4769250/article/details/7294696 在标准C和C++中0长数组如charArray[0]是不允许使用的,因为这从语义逻 ...
- 可持久化Treap
终于写了一次可持久化Treap,做的是可持久化序列的模板题. Treap Treap=Tree+Heap,是一个随机化的数据结构.它的每个节点至少有两个关键字,一个是我们要存储的\(val\),一个是 ...
- BZOJ 1050 旅行(并查集)
很好的一道题.. 首先把边权排序.然后枚举最小的边,再依次添加不小于该边的边,直到s和t联通.用并查集维护即可. # include <cstdio> # include <cstr ...
- 【bzoj4922】[Lydsy六月月赛]Karp-de-Chant Number 贪心+背包dp
题目描述 给出 $n$ 个括号序列,从中选出任意个并将它们按照任意顺序连接起来,求以这种方式得到匹配括号序列的最大长度. 输入 第一行包含一个正整数n(1<=n<=300),表示括号序列的 ...
- Java入门之:对象和类
Java对象和类 Java作为一种面向对象语言,支持以下基本概念: 多态 继承 封装 抽象 类 对象 实例 方法 重载 本节我们重点研究对象和类的概念: 对象: 对象是类的一个实例,有状态和行为.例如 ...
- [洛谷P4900]食堂
题目大意:$n(n\leqslant10^6)$组询问,每组询问给出$l,r(l,r\leqslant10^6)$,求($\{\dfrac ij\}$表示$\dfrac ij$的小数部分): $$\s ...
- [洛谷P4139]上帝与集合的正确用法
题目大意:多次询问,每次给你$p$询问$2^{2^{2^{\dots}}}\bmod p$ 题解:扩展欧拉定理,求出$\varphi(p)$即可.因为$2^{2^{2^{\dots}}}>> ...
- KNIGHTS - Knights of the Round Table 圆桌骑士 点双 + 二分图判定
---题面--- 题解: 考场上只想到了找点双,,,,然后不知道怎么处理奇环的问题. 我们考虑对图取补集,这样两点之间连边就代表它们可以相邻, 那么一个点合法当且仅当有至少一个大小至少为3的奇环经过了 ...
- 洛谷 P1311 选择客栈 解题报告
P1311 选择客栈 题目描述 丽江河边有 \(n\) 家很有特色的客栈,客栈按照其位置顺序从 \(1\) 到 \(n\) 编号.每家客栈都按照某一种色调进行装饰(总共 \(k\) 种,用整数 \(0 ...