【转】模仿QQ\MSN的网页右下角弹出层

DIV:

  
<div id="winpop">
 
<div class="title">操作结果:<span class="close" onclick="tips_pop()">X</span></div>
    
<div id="DivOperateResult" class="con"></div>
</div>

JS:


<script type="text/javascript">
//弹出层代码,调用:tips_pop()
function tips_pop(){
  
var MsgPop=document.getElementById("winpop");
  
var popH=parseInt(MsgPop.style.height);//将对象的高度转化为数字
   if (popH==0){
   MsgPop.style.display
="block";//显示隐藏的窗口
  show=setInterval("changeH('up')",2);
   }
  
else { 
   hide
=setInterval("changeH('down')",2);
  }
}

function changeH(str) {
 
var MsgPop=document.getElementById("winpop");
 
var popH=parseInt(MsgPop.style.height);
 
if(str=="up"){
  
if (popH<=100){
      MsgPop.style.height
=(popH+4).toString()+"px";
  }
  
else{  
     clearInterval(show);
  }
 }
 
if(str=="down")
 { 
  
if (popH>=4)
    {  
         MsgPop.style.height
=(popH-4).toString()+"px";
    }
  
else
    { 
        clearInterval(hide);   
        MsgPop.style.display
="none";  //隐藏DIV
    }
 }
}

window.onload
=function(){    //加载
document.getElementById('winpop').style.height='0px';
//setTimeout("tips_pop()",800);     //3秒后调用tips_pop()这个函数

}
</script>

////////////////////////////////
////////Sixi. Let it be.../////
//////////////////////////////

原文地址:https://www.cnblogs.com/sixiweb/p/1411722.html