当前位置:编程学习 > JAVA >>

请问这段代码如何处理,让消息框上升的速度更快些


<!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 runat="server">
    <title></title>
    <script type="text/javascript">
    var sheyMsg=function(box,options) { 
this.box=this.g(box); 
this.setOptions(options); 
this.init(); 

sheyMsg.prototype={ 
    ae:function(e,call) { 
        if(window.addEventListener)window.addEventListener(e,call,false); 
        else window.attachEvent("on"+e,call); 
    }, 
    g:function(id) {return typeof(id)=="string"?document.getElementById(id):id; }, 
    isFixed:!window.ActiveXObject || (navigator.userAgent.indexOf("MSIE 6")==-1 &&  document.compatMode=="CSS1Compat"), 
    setOptions:function(options) { 
this.options={//默认配置 
showDelay:0,//显示延时 
autoHide:20,//自动隐藏时间,设置为0时,不自动隐藏 
onShow:function(){},//显示后调用 
onHide:function(){}//隐藏后调用 
}; 
for(var o in options) { 
this.options[o]=options[o]; 

    }, 
    hide:function() {//隐藏 
var _top=this.box.clientHeight; 
var o=this; 
if(/ing$/.test(o.status))return; 
o.status="hiding"; 
clearTimeout(o.tt); 
o.t=setInterval(function() { 
    if(o.isFixed) 
    o.box.style.bottom=(-o.box.clientHeight+(--_top))+'px'; 
else 
    o.box.style.top=o.de.scrollTop+o.de.clientHeight-5-(--_top) +"px"; 
if(_top==-5) { 
clearInterval(o.t); 
o.status="hide"; 
o.box.style.display="none"; 
o.options.onHide(); 

},5); 
    }, 
    show:function() {//显示 
var _top=0; 
var o=this; 
if(/ing$/.test(o.status))return; 
o.status="showing"; 
clearTimeout(o.tt); 
o.box.style.display="block"; 
o.t=setInterval(function() { 
    if(o.isFixed) 
    o.box.style.bottom=(-o.box.clientHeight+(++_top))+"px"; 
else 
    o.box.style.top=(o.de.scrollTop+o.de.clientHeight-5-(++_top)) +"px"; 
if(_top==o.box.clientHeight) { 
clearInterval(o.t); 
o.status="show"; 
o.options.onShow(); 
var h=o.options.autoHide-0; 
if(h) o.tt=setTimeout(function() {o.hide();},h*1000); 

},1); 
    }, 
    fixIE6:function() {//IE6 滚动定位 
        this.box.style.left=this.de.scrollLeft+this.de.clientWidth-this.box.clientWidth-2+"px"; 
        if(this.status=="show") {            
            this.box.style.top=this.de.scrollTop+this.de.clientHeight-this.box.clientHeight-5+"px"; 
        } else if(this.status=="hide") { 
    this.box.style.top=this.de.scrollTop+this.de.clientHeight+5+"px"; 
        } 
    }, 
    init:function() { 
with(this.box.style) { 
display="block";//显示之后才能取出宽度和高度 
if(this.isFixed) { 
position="fixed"; 
right="2px"; 
bottom=(-this.box.clientHeight-5)+"px"; 
} else { 
position="absolute"; 


this.status="hide"; 
var o=this; 
if(!this.isFixed) { 
    o.de=document.compatMode=="CSS1Compat"?document.documentElement:document.body; 
    var timer; 
    this.ae("resize",function() { clearTimeout(timer);timer=setTimeout(function(){o.fixIE6.call(o)},30);}); 
    this.ae("scroll",function() { clearTimeout(timer);timer=setTimeout(function(){o.fixIE6.call(o)},30);}); 
    this.fixIE6();//加载时指定位置 

o.box.style.display="none"; 
o.tt=setTimeout(function() {o.show();},o.options.showDelay*1000); 


    </script>

<style type="text/css">
.msg { width:240px;display:none; } 

    .pink .top,.pink .top .title,.pink .top span,.pink .bottom,.pink .bottom a {background:transparent url(images/msg_bg_pink.gif) no-repeat 0px 0px;} 
    .pink .center {background:url(images/center_bg_pink.gif) repeat-y;} 
    
    .blue .top,.blue .top .title,.blue .top span,.blue .bottom,.blue .bottom a {background:transparent url(images/msg_bg_blue.gif) no-repeat 0px 0px;} 
    .blue .center {background:url(images/center_bg_blue.gif) repeat-y;} 
    
    .msg .top{width:240px;height:25px;position:relative;} 
    .msg .top .title {background-position:-195px -70px;padding-left:30px;line-height:22px;width:100px;height:25px;} 
    .msg .top span {background-position:0px -70px;width:36px; height:17px;position:absolute;top:1px;left:198px;cursor:pointer;} 
    .msg .top span:hover {background-position:-43px -71px;} 

    .msg .center { width:240px;height:115px;} 
    .msg .center h3{color:#0c4e7c;text-align:center;line-height:23px;font-size:13px;} 
    .msg .center p{color: #0c4e7c;margin:0px 10px;line-height:20px;} 

    .msg .bottom {height:29px;background-position:0px -32px;} 
    .msg .bottom a {background-position:-120px -75px;padding-left:20px;margin:7px 10px;float:right;width:30px;height:20px;} 
</style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    
    <input type=button  id='sss' onclick="closewin()" value='关闭'/>
    <input type=button  id='Button1' onclick="openwin()" value='打开'/>
    <!--sheyMsg start--> 
<div class="msg pink" id="msgbox"> 
<div class="top"> 
    <div class="title">CSDN News</div> 
    <div id='btn'> 
    </div>
    <span title="close" id="msgclose"></span> 
</div> 
<div class="center"> 
<h3>仿腾讯右下角消息提示</h3> 
<p>showDalay:设置页面加载后显示时间延迟;<br />autoHide:显示后自动隐藏的时间,默认30秒,设置为0表示不自动隐藏;</p> 
</div> 
<div class="bottom"><a target="_blank" href="#">查看</a> 
</div> 
</div> 
<!--sheyMsg end--> 
<script type="text/javascript">
var msg=new sheyMsg("msgbox",{ 
    showDelay:0,// 
onHide:function(){ 
btn.value="Show"; 
}, 
onShow:function() { 
btn.value="Hide"; 

});
msg.show();

</script>



<script type="text/javascript">
    function openwin() {

        var msg = new sheyMsg("msgbox", {
            showDelay: 0, // 
            onHide: function() {
                btn.value = "Show";
            },
            onShow: function() {
                btn.value = "Hide";
            }
        });
        msg.show();
    }

    function closewin() {

        var msg = new sheyMsg("msgbox", {
            showDelay: 0, // 
            onHide: function() {
                btn.value = "Show";
            },
            onShow: function() {
                btn.value = "Hide";
            }
        });
        msg.hide();
}
</script>
    </div>
    </form>
</body>
</html>
--------------------编程问答-------------------- 好长啊。。 
补充:Java ,  Web 开发
CopyRight © 2012 站长网 编程知识问答 www.zzzyk.com All Rights Reserved
部份技术文章来自网络,