可以..吗

个回答

yuyang123

2016-06-09 16:58:44

已采纳

不行，你用二级菜单的话，鼠标移除时无任何选项卡显示。

0
qq_慕UI9367020: 2016-06-09 17:48:20
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>实践题 - 选项卡</title>
    <style type="text/css">
        *{  font-family: "微软雅黑";}
        body{
            min-width: 1300px;}
        .q1{
            position: relative;width: 300px;margin: 0px auto;}
        .w1{
            position: absolute;z-index: 1;left: -30px;}
        .e1{
            display: inline-block;width: 50px;text-align: center;padding: 6px 10px;list-style: none;border: 1px solid #000;border-bottom: 0px;}
        .e2{
            border-top: 3px solid #C30;border-bottom: 3px solid #FFF;}
        .w2{
            position: relative;top: 52px;border: 1px solid #000;border-top: 3px solid #C30;}
        .w2 ul{
            position: relative;left: -20px;font-size: 14px;line-height: 25px;list-style: none;}
        .r1{
            display:none;}
        .r2{
            display:block;}

    </style>
    <script type="text/javascript">
        function ta(y1) {
            var d1=document.getElementsByClassName("e1");
            var d2=document.getElementsByClassName("e2")[0];
            var f1=document.getElementsByClassName("r1");
            var f2=document.getElementsByClassName("r2")[0];
            for(var i=0;i<=d1.length;i++){
                if(d1[i]==y1){
 d2.setAttribute("class","e1");
 d1[i].setAttribute("class","e1 e2");
 f2.setAttribute("class","r1");
 f1[i].setAttribute("class","r2");
                }
            }
        }
    </script>
</head>
<body>
<div class="q1">
    <div class="w1">
        <ul>
            <li class="e1 e2" onmouseover="ta(this)">房产</li>
            <li class="e1" onmouseover="ta(this)">家居</li>
            <li class="e1" onmouseover="ta(this)">二手房</li>
        </ul>
    </div>
    <div class="w2">
        <ul class="r2">
            <li><a href="#">275万购昌平邻铁三居 总价20万买一居</a></li>
            <li>200万内购五环三居 140万安家东三环</li>
            <li>北京首现零首付楼盘 53万购东5环50平</li>
            <li>京楼盘直降5000 中信府 公园楼王现房</li>
        </ul>
        <ul class="r1">
            <li>40平出租屋大改造 美少女的混搭小窝</li>
            <li>经典清新简欧爱家 90平老房焕发新生</li>
            <li>新中式的酷色温情 66平撞色活泼家居</li>
            <li>瓷砖就像选好老婆 卫生间烟道的设计</li>
        </ul>
        <ul class="r1">
            <li>通州豪华3居260万 二环稀缺2居250w甩</li>
            <li>西3环通透2居290万 130万2居限量抢购</li>
            <li>黄城根小学学区仅260万 121平70万抛!</li>
            <li>独家别墅280万 苏州桥2居优惠价248万</li>
        </ul>
    </div>
</div>

</body>
</html>