onmouseover 弹出 div层
或者用AJAX做 

解决方案 »

  1.   

    <style type="text/css">
    .f{
    cursor:pointer;
    position:absolute;
    width:357px;
    height:194px;
    padding:15px 0 0 50px;
    background-image:url(http://static5.photo.sina.com.cn/middle/4ef69b3dg5785994300a4&000.jpg)
    }
    </style>
    <script>
    var oo = true
    function create(){
    if(oo==true){
    oo=false
    var div =document.createElement("div")
    div.className="f"
    div.id="div"
    div.innerHTML="<a href='#'>大法师</a><br>山丘之王<br>血法师<br>怕拉丁"
    document.body.appendChild(div)
    document.getElementById("div").style.left=document.getElementById("text").offsetLeft+30
    document.getElementById("div").style.top=document.getElementById("text").offsetTop
    div.onmouseout=del
    }}function del(e){
    e=e||event;
    var obj=e.relatedTarget||e.toElement;
    var div =document.getElementById("div")
    if(div.contains(obj))return;
    document.body.removeChild(div)
    oo=true
    }</script>
    <span  id="text" onmouseover="create()" style="cursor:pointer;" onMouseOut="del()" >人族</span>
    写这么个例子真划算,基本上每个星期都有人问。。
      

  2.   

    效果貌似是出来了,可如果在DIV上显示动态的数据,貌似你上面的做法出不来吧~~
      

  3.   

    纯js比较麻烦  一次就得把所有的数据全部读出来 好象没有网站这样去做了。。
    动态显示数据是ajax的范畴了,这个地方可写不出来,至少我写不出来。