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


Posted in Javascript onMay 05, 2015

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

<!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 相关文章推荐
js 无提示关闭浏览器页面的代码
Mar 09 Javascript
jquery实现心算练习代码
Dec 06 Javascript
实现js保留小数点后N位的代码
Nov 13 Javascript
浅析javascript异步执行函数导致的变量变化问题解决思路
May 13 Javascript
Highcharts 多个Y轴动态刷新数据的实现代码
May 28 Javascript
extjs简介_动力节点Java学院整理
Jul 17 Javascript
微信小程序开发之IOS和Android兼容的问题
Sep 26 Javascript
浅谈mint-ui 填坑之路
Nov 06 Javascript
详解Vue-cli3.X使用px2rem遇到的问题
Aug 09 Javascript
Javascript类型判断相关例题及解析
Aug 26 Javascript
Element-ui树形控件el-tree自定义增删改和局部刷新及懒加载操作
Aug 31 Javascript
Vue项目如何引入bootstrap、elementUI、echarts
Nov 26 Vue.js
JS实现点击按钮后框架内载入不同网页的方法
May 05 #Javascript
JS实现随机乱撞彩色圆球特效的方法
May 05 #Javascript
jquery实现图片随机排列的方法
May 04 #Javascript
jquery实现的美女拼图游戏实例
May 04 #Javascript
jQuery实现仿Alipay支付宝首页全屏焦点图切换特效
May 04 #Javascript
jQuery插件kinMaxShow扩展效果用法实例
May 04 #Javascript
jQuery消息提示框插件Tipso
May 04 #Javascript
You might like
非洲第一个咖啡超凡杯大赛承办国—卢旺达的咖啡怎么样
2021/03/03 咖啡文化
PHP使用FFmpeg获取视频播放总时长与码率等信息
2016/09/13 PHP
thinkPHP中钩子的两种配置调用方法详解
2016/11/11 PHP
PHP面向对象之里氏替换原则简单示例
2018/04/08 PHP
Laravel实现搜索的时候分页并携带参数
2019/10/15 PHP
JavaScript静态的动态
2006/09/18 Javascript
javascript使用onclick事件改变选中行的颜色
2013/12/30 Javascript
javascript检查浏览器是否支持flash的实现代码
2014/08/14 Javascript
Node.js中使用mongoskin操作mongoDB实例
2014/09/28 Javascript
JavaScript实现图片DIV竖向滑动的方法
2015/04/25 Javascript
jQuery+PHP+Mysql实现抽奖程序
2020/04/12 jQuery
JavaWeb表单及时验证功能在输入后立即验证(含用户类型,性别,爱好...的验证)
2017/06/09 Javascript
简单快速的实现js计算器功能
2017/08/17 Javascript
vue 做移动端微信公众号采坑经验记录
2018/04/26 Javascript
Vue表单控件绑定图文详解
2019/02/11 Javascript
layui 中select下拉change事件失效的解决方法
2019/09/20 Javascript
使用JavaScript计算前一天和后一天的思路详解
2019/12/20 Javascript
python cookielib 登录人人网的实现代码
2012/12/19 Python
在Gnumeric下使用Python脚本操作表格的教程
2015/04/14 Python
Python模块包中__init__.py文件功能分析
2016/06/14 Python
Python利用pandas计算多个CSV文件数据值的实例
2018/04/19 Python
Django实战之用户认证(初始配置)
2018/07/16 Python
解决pyinstaller打包发布后的exe文件打开控制台闪退的问题
2019/06/21 Python
python实现交并比IOU教程
2020/04/16 Python
Python pymsql模块的使用
2020/09/07 Python
详解Anaconda安装tensorflow报错问题解决方法
2020/11/01 Python
Python创建自己的加密货币的示例
2021/03/01 Python
使用CSS3中的calc()属性来以算式表达尺寸数值
2016/06/06 HTML / CSS
Gibson London官网:以地道的英国男装而著称
2019/12/06 全球购物
PHP面试题附答案
2015/11/28 面试题
优秀毕业生求职信范文
2014/01/02 职场文书
广播体操比赛口号
2014/06/10 职场文书
单位委托书范本(3篇)
2014/09/18 职场文书
商业用房租赁协议书
2014/10/13 职场文书
毕业设计致谢词
2015/05/14 职场文书
周一给客户的问候语
2015/11/10 职场文书