求一个JS特效，鼠标移到超链接上，显示详细信息

用onmouseenter 和onmouseleave试试

解决方案 »

  1.   

    分拿来<html><head><title></title></head><body>
    <div style="filter:alpha(opacity=70); position: absolute; color: #000000; display:none; background-color: #DDEDFB;  border: 1px solid #0099CC; font-size:13px;" id="pop">Hi,你好</div>
    <a href="#" onmousemove="move(this);" onmouseout="layer1.style.display='none';" >哈哈</a>
    <script language="javascript" type="text/javascript">
    var objDiv = document.getElementById("pop");
    function move(){
       objDiv.style.left = event.x + 10;
       objDiv.style.top = event.y - 10;
       objDiv.style.display = '';
    }
    </script>
    </body></html>
      

  2.   

    上面的标签改了下名字。离开事件里的名字忘了改，有点小问题，现在弄好了<html><head><title></title></head><body>
    <div style="filter:alpha(opacity=70); position: absolute; color: #000000; display:none; background-color: #DDEDFB;  border: 1px solid #0099CC; font-size:13px;" id="pop">Hi,你好</div>
    <a href="#" onmousemove="move(this);" onmouseout="pop.style.display='none';" >哈哈</a>
    <script language="javascript" type="text/javascript">
    var objDiv = document.getElementById("pop");
    function move(){
       objDiv.style.left = event.x + 10;
       objDiv.style.top = event.y - 10;
       objDiv.style.display = '';
    }
    </script>
    </body></html>
      

  3.   

    <script language=javascript>
    function show(obj)
    {    
    var str=getIE(obj)
    var temp=str.split(",")
    var top=temp[0]
    var left=temp[1]
    var objDiv=document.getElementById("div1")
    objDiv.style.display="";
    objDiv.style.left=temp[1];
    objDiv.style.top=parseInt(temp[0])+parseInt(obj.offsetHeight);
    }
    function getIE(e){
    var t=e.offsetTop;
    var l=e.offsetLeft;
    while(e=e.offsetParent){
    t+=e.offsetTop;
    l+=e.offsetLeft;
    }
    return (t+","+l);
    }
    function hide(obj){obj.style.display="none"}
    </script>
    <div id="div1"  onMouseOut="hide(this)"style="background-color:red;position:absolute; width:200px; height:100px; top:-100px;"><a href="#">你的问题</a>有问题没</div><a href="javascript:void(0)" onmouseover=show(this)>点我</a>
    <br>
    <br>
    <br>
    <br>
    <a href="javascript:void(0)" onmouseover=show(this)>点我</a>
    <br>
    ______________________________________________________________________________
      

  4.   

    谢谢大家的帮助，但是还是有点小问题，像sangok 的那个效果，如果鼠标没有经过div，而是直接离开了<a>标签，那么div就不会隐藏
    我想要的效果是，鼠标指向<a>后，显示出提示<div>,如果鼠标离开了<a>并且鼠标也不在<div>里面，或者鼠标离开了<div>并且鼠标也不在<a>里面，那么<div>才隐藏，也就是说，需要同时满足几个条件<div>才隐藏：<a>或者<div>发生了onmouseout，并且鼠标即不在<div>里也不在<a>里。我是菜鸟，不知道我说的是不是清楚
    我发现CSDN论坛上就有这种效果，只要把鼠标指向发帖者的名字，就会弹出这样的提示框
      

  5.   

    要作出这种效果,其实很简单啊,DIV和链接之间最好没有空隙
    a : onmouseover="showDiv()" onmouseout="hideDiv()"
    div : onmouseover="showDiv()" onmouseout="hideDiv()"CSDN里的这个,浮动框箭头空白处一大块其实也是在div里的
      

  6.   

    不兼容火狐和google的浏览器啊