在jsp里面 當鼠標元素觸發onmouseover時，旁邊出現一個浮動且跟隨鼠標的div ，移開消失

     JSP頁面 ：

 

            

<label onmouseover="showLongStrlog(window.event, '<list:seqnum></list:seqnum>')" onmouseout="showDialog(window.event,'<list:seqnum></list:seqnum>')" >

                      <list:column field="EMPLOEE_REQUIRE" abbr="8"/>

                      <div id="showLong<list:seqnum></list:seqnum>"  style="top:0; left:0;  position:absolute;display:none; z-index:100;font:normal 12px/16px '宋體'; width:180px;margin:0 auto; color:#666; padding:3px;z-index:10; background:#f9fdfd;"><TEXTAREA rows="20" cols="20" style="border:0px;font:normal 12px/16px '宋體'; width:180px;margin:0 auto; color:#666; padding:3px;z-index:10; background:#f9fdfd; border:1px solid #0aa;overflow:hidden; resize:none;" ><list:column field="EMPLOEE_REQUIRE"/></TEXTAREA></div>

            </label>

 

 

  js :

      

    function showLongStrlog(e, i){

var oDiv=document.getElementById('showLong'+i);

oDiv.style.display="";

        var scrollTop=document.documentElement.scrollTop||document.body.scrollTop;

        var scrollLeft=document.documentElement.scrollLeft||document.body.scrollLeft;

        var oEvent = e || window.event;

        oDiv.style.top = scrollTop+oEvent.clientY+"px";

        oDiv.style.left=scrollLeft+oEvent.clientX+"px";

       }

     function showDialog(e, i){

var oDiv=document.getElementById('showLong'+i);

oDiv.style.display="none";

    }