javascript实现仿IE顶部的可关闭警告条_javascript技巧

功能非常实用,代码非常简单,就不多废话了,直接奉上:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>仿IE顶部的警告条,可以关闭</title>
<style type="text/css">
#informationbar{
position: fixed;
left: 0;
width: 100%;
text-indent: 5px;
padding: 5px 0;
background-color: lightyellow;
border-bottom: 1px solid black;
font: bold 12px Verdana;
}
* html #informationbar{ /*IE6 hack*/
position: absolute;
width: expression(document.compatMode=="CSS1Compat"? document.documentElement.clientWidth+"px" : body.clientWidth+"px");
}
</style>
<script type="text/javascript">
function informationbar(){
this.displayfreq="always"
this.content='<a href="javascript:informationbar.close()"><img src="close.gif" style="width: 14px; height: 14px; float: right; border: 0; margin-right: 5px"

/></a>'
}
informationbar.prototype.setContent=function(data){
this.content=this.content+data
document.write('<div id="informationbar" style="top: -500px">'+this.content+'</div>')
}
informationbar.prototype.animatetoview=function(){
var barinstance=this
if (parseInt(this.barref.style.top)<0){
this.barref.style.top=parseInt(this.barref.style.top)+5+"px"
setTimeout(function(){barinstance.animatetoview()}, 50)
}
else{
if (document.all && !window.XMLHttpRequest)
this.barref.style.setExpression("top", 'document.compatMode=="CSS1Compat"? document.documentElement.scrollTop+"px" : body.scrollTop+"px"')
else
this.barref.style.top=0
}
}
informationbar.close=function(){
document.getElementById("informationbar").style.display="none"
if (this.displayfreq=="session")
document.cookie="infobarshown=1;path=/"
}
informationbar.prototype.setfrequency=function(type){
this.displayfreq=type
}
informationbar.prototype.initialize=function(){
if (this.displayfreq=="session" && document.cookie.indexOf("infobarshown")==-1 || this.displayfreq=="always"){
this.barref=document.getElementById("informationbar")
this.barheight=parseInt(this.barref.offsetHeight)
this.barref.style.top=this.barheight*(-1)+"px"
this.animatetoview()
}
}
window.onunload=function(){
this.barref=null
}
</script>
<script type="text/javascript">
<!--Invocation code-->
var infobar=new informationbar()
infobar.setContent('敬告:明天中午12点天降钱雨,请备好麻袋!  <a href="#">购买麻袋</a>  <a href="#">购买麻袋</a>')
infobar.initialize()
</script>
</head>
<body>
</body>
</html>

以上所述就是本文的全部内容了,希望大家能够喜欢。

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索javascript
顶部警告条
ios 顶部警告提示框、javascript回到顶部、javascript 返回顶部、javascript警告框、javascript滚动到顶部,以便于您获取更多的相关知识。

时间: 2024-09-20 23:21:35

javascript实现仿IE顶部的可关闭警告条_javascript技巧的相关文章

javascript实现仿IE顶部的可关闭警告条

  仿windows IE顶部的敬告工具条,带关闭按钮,设计还算精美,你完全可以用到自己的网页用于显示提示等方面,有需要的小伙伴可以参考下. 功能非常实用,代码非常简单,就不多废话了,直接奉上: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53

JavaScript检测弹出窗口是否已经关闭的方法_javascript技巧

本文实例讲述了JavaScript检测弹出窗口是否已经关闭的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: var win = window.open('foo.html','windowName',"width=200,height=200,scrollbars=no"); var timer = setInterval(function() {       if(win.closed) {          clearInterval(timer);     

Javascript点击其他任意地方隐藏关闭DIV实例_javascript技巧

代码如下,实现了点击input显示一个div层,当点击除input和div以外的地方的时候,隐藏div的功能. <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>点击其它地方关闭DIV</title> </head> <body> <input type="text" value="

javascript判断网页是关闭还是刷新_javascript技巧

原理就是通过离开页面行为时间onunload触发时间去检测此时的浏览器的窗口大小,根据大小由此判断用户是刷新,跳转或是关闭行为程序  代码如下  window.onunload = function(){ var a_n = window.event.screenX - window.screenLeft; var a_b = a_n > document.documentElement.scrollWidth-20; if(a_b && window.event.clientY&l

JavaScript常用的返回,自动跳转,刷新,关闭语句汇总_javascript技巧

本文实例讲述了JavaScript常用的返回,自动跳转,刷新,关闭语句.分享给大家供大家参考.具体如下: 1. Javascript 返回上一页: 复制代码 代码如下: history.go(-1)返回两个页面: 复制代码 代码如下: history.go(-2)    2. 后退: 复制代码 代码如下: history.back() 3. 返回下一页: 复制代码 代码如下: window.history.forward() 4. 返回第几页,也可以使用访问过的URL: 复制代码 代码如下: w

javascript打开新窗口同时关闭旧窗口_javascript技巧

其实这个问题和浏览器的版本息息相关,作为菜鸟的我,直到现在也没有找到完美的解决办法.没办法,因为业务必须要实现,所以只好用另一种方法去做了:通过重定向URL实现打开新窗口的同时"关闭"旧窗口 test1.html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> test1 </TITLE>

分享JavaScript获取网页关闭与取消关闭的事件_javascript技巧

在做Web开发时,我们经常用到页面关闭事件onbeforeunload,可以给用户一个选择放弃关闭的机会,就比如这个博客编辑器.如果用户选择了离开,那么onunload事件自然会触发:但若用户选择了取消,又该如何检测呢? 我们假定一个页面离开取消事件,叫做onunloadcancel.显然,这个事件应触发在用户按下对话框的取消按钮之后.但关闭提示对话框的触发流程并不是那么简单.我们先来回顾下这个过程: 复制代码 代码如下: window.onbeforeunload = function(){ 

javascript 无提示关闭窗口脚本_javascript技巧

复制代码 代码如下: function CloseWin() { window.opener=null; window.open('','_self'); window.close(); } 实例: 复制代码 代码如下: <input type=button value="关闭" onclick="CloseWin()">

JS实现简单的顶部定时关闭层效果_javascript技巧

复制代码 代码如下: <script type="text/javascript"> var time = 300; var h = 0; function addCount() { if(time>0) { time--; h = h+5; } else { return; } if(h>300) //高度 { return; } document.getElementById("ads").style.display = "&q