页面浮动

就是在页面中，比如有列表中第一行为“A”，第二行为“B”，当鼠标放在“A”上，会浮动的显示“对A的解释”等字符，当鼠标离开“A”，就不显示，请问这个怎么做？

解决方案 »

  1.   

    最简单的方式就是写title属性 只不过这个不能添加样式
      

  2.   


    <html>
    <head>
    <style type="text/css">
    .a{
    display:none;
    margin-top:-150px;
    margin-left:250px;
    width:200px;
    padding:40px;
    background:#FFFFFF;
    border:solid 1px #c3c3c3
    }
    .blue{
    background-color:blue
    }
    </style>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/JavaScript">
    $(function(){
    $("tr:eq(0)").mouseover(function(){$(this).addClass("blue"); $("#div2").addClass(".a").show();});
    $("tr:eq(0)").mouseout(function(){$(this).removeClass("blue");$("#div2").hide();});
    })
    </script>
    </head>
    <body>
    <div id="div1"><table border="1" cellpadding="15" >
    <tbody>
    <tr>
    <td>0</td>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
    </tr>
    <tr>
    <td>0</td>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
    </tr>
    <tr>
    <td>0</td>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
    </tr>
    </tbody>
    </table>
    </div>
    <div id="div2" class="a">
    对a解释的语句
    </div>