【仿IE顶部弹出提示】可用来设置公告可关闭

第一种方式:基础写法(浏览器页面上方全占满,提示信息前后都有图片,鼠标放在图片上显示小手,点击图片关闭)
<div id='top_tooltip' style="BORDER-RIGHT: #fff 1px solid;
BORDER-TOP: #fff 1px solid; DISPLAY: none;
FONT-SIZE: 12px; BACKGROUND: #ffffe1;
MARGIN: 1px auto; BORDER-LEFT: #fff 1px solid;
COLOR: #ff4e00; LINE-HEIGHT: 26px;
BORDER-BOTTOM: #aca899 1px solid;
HEIGHT: 26px; TEXT-ALIGN: left"
>
<A style="DISPLAY: inline;
BACKGROUND: url(warning.gif);
FLOAT: left; MARGIN: 5px 10px;
WIDTH: 15px; CURSOR: pointer; HEIGHT: 15px"
οnclick='set_top_visible("none");'
>
</A>
<A style="DISPLAY: inline; BACKGROUND: url(add.gif);
FLOAT: right; MARGIN: 5px 10px; WIDTH: 15px; CURSOR: pointer; HEIGHT: 15px"
οnclick='set_top_visible("none");'
></A>
<SPAN style="COLOR: #333">系统提醒您:</SPAN>您当前使用的浏览器版本过低,可能无法正常显示本社区内容,请升级您的浏览器到最新版!
</div>
<SCRIPT type=text/javascript>
        var st = 0000;
        var ht = 5000;
        function set_top_visible(v){
            (!v) && (v = "block");
            try
            {
                document.getElementById("top_tooltip").style.display=v;
            }
            catch(e){}
        }
        setTimeout("set_top_visible()",st);
    </SCRIPT>
----------------------------------------------------------------
第二种方式:比较牛差的写法,用document.createElemen(浏览器页面上方中间显示占,提示信息后有图片,鼠标放在图片上显示小手,点击图片关闭)
<SCRIPT type=text/javascript>
      Ext.onReady(function() {
   if ((Ext.isIE && (Ext.isIE6 || Ext.isIE7))) {//用ext的已有方法判断是否是ie6或者ie7
    var newDiv = document.createElement("div");
   
    newDiv.style.position = "absolute";
    newDiv.style.zIndex = "9999";
    newDiv.style.width = "1000px";
    newDiv.style.height = "16px";
    newDiv.style.top = "1px";
    newDiv.style.left = (parseInt(document.body.scrollWidth)-685) / 2 + "px";
    newDiv.style.background = "#ffffe1";
    newDiv.style.border = "#fff 1px solid";
    newDiv.style.padding = "2px";
  
    newDiv.id="top_tooltip";
    newDiv.style.color="#ff4e00";
    //newDiv.innerHTML = '<SPAN style="COLOR: #333">系统提醒您:</SPAN>您当前使用的浏览器版本过低,可能无法正常显示本社区内容,请升级您的浏览器到最新版!';
    //js页面不让写中文,故直接用的ASC码
    newDiv.innerHTML = '<SPAN style="COLOR: #333"><strong>\u6ce8\u610f\uff1a</strong></SPAN>\u8be5\u7cfb\u7edf\u91c7\u7528\u4e86\u5148\u8fdb\u7684\u5bcc\u5ba2\u6237\u7aef\u6280\u672f\uff0c\u60a8\u6240\u4f7f\u7528\u7684\u6d4f\u89c8\u5668\u8f83\u4e3a\u9648\u65e7\uff0c\u5efa\u8bae\u60a8\u5c06\u6d4f\u89c8\u5668\u5347\u7ea7\u81f3IE8\u6216\u66f4\u9ad8\u7248\u672c\u4ee5\u83b7\u5f97\u66f4\u597d\u7684\u4f53\u9a8c\u3002';
    
    var img=new Image();
    img.src="images/delete.gif";
    img.style.cursor= 'pointer';
    img.onclick = function(){set_top_visible("none");}'
    function set_top_visible(v){
     (!v) && (v = "block");
     try
     { 
      document.getElementById("top_tooltip").style.display=v;
     } catch(e){}
    }
    newDiv.appendChild(img);
    document.body.appendChild(newDiv);
   }
     });
 </SCRIPT>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值