zoukankan      html  css  js  c++  java
  • 微博菜单伸缩展开

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>练习微博</title>
    <script type="text/javascript" src="http://cdn.gbtags.com/jquery/1.11.1/jquery.min.js"></script>
    <style type="text/css">
    /**{margin:0;padding:0;}*/
    li{list-style:none;}
    .lis{80px;height:30px;border:1px solid #333;position:relative;}
    .lis a{display:block;line-height:30px;text-align:center;text-decoration: none;color:#000;background:#f1f1f1;}
    ul ul{margin:0;padding:0;140px;border:1px solid #333;position:absolute;top:30px;left:-1px;background:#f1f1f1;display:none;display:none;}
    ul ul li{text-align:center;line-height:30px;}
    </style>

    </head>
    <body>
    <ul>
    <li class="lis" id="lis">
    <a href="#" id="link">微博</a>
    <ul id="ul1">
    <li>私信</li>
    <li>评论</li>
    <li>@我</li>
    </ul>
    </li>
    </ul>
    </body>
    </html>
    <script type="text/javascript">
    window.onload=function (){
    var li=document.getElementById("lis");
    var ul1=document.getElementById("ul1");
    var link=document.getElementById("link");

    li.onmouseover=show;
    li.onmouseout=hide;
    function show(){
    ul1.style.display='block';
    link.style.background="yellow";
    }
    function hide(){
    ul1.style.display='none';
    link.style.background="#f1f1f1";
    }
    }
    abc();
    </script>

  • 相关阅读:
    Windows Server 2008搭建AD域控服务器
    远程桌面出现CredSSP解决方案
    破解Excel工作表保护,清除所有密码并获取密码
    Windows Server 2008 R2 搭建NTP时间服务器
    VMware Tools
    windows常用运行命令
    无线AP与AC详解
    单臂路由
    ACL控制指定IP访问限制
    Linux下安装VMware
  • 原文地址:https://www.cnblogs.com/ll-taj/p/6531923.html
Copyright © 2011-2022 走看看