码迷,mamicode.com
首页 > 其他好文 > 详细

悬浮框

时间:2014-08-19 16:15:54      阅读:150      评论:0      收藏:0      [点我收藏+]

标签:style   blog   color   java   os   io   ar   cti   

这段时间再弄悬浮框,很简单的效果,记录下,防止忘记

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">  
 <HTML>  
  <style>  
   #hint{  
    width:198px;  
    border:1px solid #000000;  
    background:#99ff33;  
    position:absolute;  
    z-index:9;  
    padding:6px;  
    line-height:17px;  
    text-align:left;   
   }  
  </style>  
  <SCRIPT LANGUAGE="JavaScript">  
   <!--  
    function showme(){  
     var oSon = window.document.getElementById("hint");  
     if (oSon == null) return;  
     with (oSon){  
      
      style.display = "block";  
      style.pixelLeft = window.event.clientX + window.document.body.scrollLeft + 6;  
   
      style.pixelTop = window.event.clientY + window.document.body.scrollTop + 9;  
   
     }  
    }  
    function hidme(){  
     var oSon = window.document.getElementById("hint");  
     if(oSon == null) return;  
     oSon.style.display="none";  
    }  
   //-->  
  </SCRIPT>  
  <BODY>  
   <text id="guoguo" value="ga">  

   <a href="#" onmouseover="showme()" onmouseout="hidme()" onmousemove="showme()">dfdfd</a>

   <div id="hint" style="display:none"></div>  
  </BODY>  
 </HTML> 

 

悬浮框,布布扣,bubuko.com

悬浮框

标签:style   blog   color   java   os   io   ar   cti   

原文地址:http://www.cnblogs.com/bobo-pcb/p/3922145.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!