• 在网页左上角隐藏的滑出导航菜单


    代码简介:在网页右上角隐藏的滑出菜单,鼠标移过去,菜单自然出现,移开自动隐藏,可以用作副菜单。

    代码内容:

    <html>
    <head>
    <title>在网页左上角隐藏的滑出导航菜单_网页代码站(www.webdm.cn)</title>
    </head>
    <body>
    <style type="text/css">
    <!--
    #menuBar
    {position: absolute;left: -200px; width: 300px; top: 0px; clip: rect( )}
    #glider
    {position: absolute;left: 200px;top: 0px; width: 80px}/* www.webdm.cn */
    .glideText
    {font-size: 18px;color: #E2E2E2;text-decoration: none; font-family: Verdana, Arial, Helvetica, sans-serif}
    a:link
    { color: #D7D7D7; text-decoration: none}
    a:visited
    { color: #E0E0E0; text-decoration: none}
    a:active
    { color: #333333; text-decoration: none}
    a:hover
    { color: #333333}
    .mentd
    { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color: #333333; background-color: #999999; background-image:

    url(graygrid2.gif)
    }
    td
    { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 13px; color: #333333}
    h1
    { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 16px; color: #FFFFFF}
    -->
    </style>
    <script language="JavaScript">
    <!--
    var pee = -200
    var drec = 40;
    var speed = 20;
    var l = pee;
    function Proj7GlideBack () {l += drec;
    if (document.layers) {
    document.menuBar.left
    = l;
    }
    else if (document.all) {document.all.menuBar.style.pixelLeft = l;
    }
    else if (document.getElementById) {document.getElementById('menuBar').style.left = l + 'px';
    }
    if (l < 0)
    setTimeout(
    'Proj7GlideBack()', speed);

    else {
    if (document.layers) {
    var html = '';
    html
    += '<A HREF="javascript:;"';
    html
    += 'onClick="Proj7GlideOut(); return false;"';
    html
    += 'Class="glideText"';
    html
    += 'close'+ '<br>';
    html
    += 'close'+ '<Br>';
    html
    += '<\/A>';
    var a = window.document.menuBar.document.glider;
    a.document.open();
    a.document.write(html);
    a.document.close();
    }
    else if (document.all) {document.all.glidetextLink.innerHTML = 'close';
    document.all.glidetextLink.onclick
    = moveIn;
    }
    else if (document.getElementById) {
    document.getElementById(
    'glidetextLink').firstChild.nodeValue ='close';
    document.getElementById(
    'glidetextLink').onclick = moveIn;
    }
    }
    }

    function Proj7GlideOut () {l -= drec;
    if (document.layers) {document.menuBar.left = l;
    }
    else if (document.all) {document.all.menuBar.style.pixelLeft = l;
    }
    else if (document.getElementById) {document.getElementById('menuBar').style.left = l + 'px';
    }
    if (l > pee)
    setTimeout(
    'Proj7GlideOut()', speed);
    else {
    if (document.layers) {
    var html = '';
    html
    += '<A HREF="javascript:;"';
    html
    += 'onclick="Proj7GlideBack(); return false;"';
    html
    += 'Class="glideText"';
    html
    += 'menu'+ '<Br>';
    html
    += 'menu'+ '<Br>';
    html
    += '<\/A>';
    var a = window.document.menuBar.document.glider;
    a.document.open();
    a.document.write(html);
    a.document.close();
    }
    else if (document.all) {document.all.glidetextLink.innerHTML = 'Menu';
    document.all.glidetextLink.onclick
    = moveOut;
    }
    else if (document.getElementById) {
    document.getElementById(
    'glidetextLink').firstChild.nodeValue = 'Menu';
    document.getElementById(
    'glidetextLink').onclick = moveOut;
    }
    }
    }
    function moveIn () {Proj7GlideOut();return false;
    }
    function moveOut() {Proj7GlideBack();return false;
    }
    <!--NNresizeFix Reloads the page to workaround a Netscape Bug-->
    if (document.layers) {
    origWidth
    = innerWidth;
    origHeight
    = innerHeight;}
    function reDo() {
    if (innerWidth != origWidth || innerHeight != origHeight)
    location.reload();}
    if (document.layers) onresize = redo;
    //-->
    </script>
    <div ID="menuBar" style="">
    <table width="272" border="0" cellspacing="0" cellpadding="0" bgcolor="#333333">
    <tr>
    <td>
    <table width="100%" border="0" cellpadding="8" cellspacing="1">
    <tr>
    <td bgcolor="#FF9900" valign="top" class="mentd">
    <a href="/" onFocus="if(this.blur)this.blur()" class="menu">网页特效</a><Br>
    <a href="http://www.webdm.cn" onFocus="if(this.blur)this.blur()" class="menu">网站开发</a><Br>
    <a href="http://www.webdm.cn" onFocus="if(this.blur)this.blur()" class="menu">电子书籍</a><Br>
    <a href="/" onFocus="if(this.blur)this.blur()" class="menu">站长工具</a><Br>
    <a href="http://www.webdm.cn" onFocus="if(this.blur)this.blur()" class="menu">网页特效</a><Br>
    <a href="/" onFocus="if(this.blur)this.blur()" class="menu">论坛系统</a>
    </td>
    <td width="72" bgcolor="#CC0000"> </td>
    </tr>
    </table>
    </td>
    </tr>
    </table>
    <span ID="glider" style="">
    <table border="0" cellspacing="0" cellpadding="0">
    <tr align="center">
    <td><a id="glidetextLink"
    href
    ="javascript:;"
    class
    ="glideText"
    onClick
    ="Proj7GlideBack(); return false" onFocus="if(this.blur)this.blur()">Menu</a></td>
    </tr>
    </table></span> </div>
    </body>
    </html>
    <br>
    <a href="http://www.webdm.cn">网页代码站</a> - 最专业的代码下载网站 - 致力为中国站长提供有质量的代码!

    代码来自:http://www.webdm.cn/webcode/dec2a8ba-9c04-4dca-b071-472773a3d898.html

  • 相关阅读:
    CentOS 7 安装 Nginx (LNMP环境搭建第一步)
    JS去除字符串最后的逗号
    mkdir如何创建多级目录
    php实现获取数组中相同/不相同的元素
    git 查看远程仓库地址
    windows git pull或者push或者clone代码时弹出安全框解决办法
    【laravel】api路由无法访问
    PHP开发api接口安全验证
    PHP根据身份证号码,获取性别、获取生日、计算年龄等多个信息
    PHP按一定比例压缩图片
  • 原文地址:https://www.cnblogs.com/webdm/p/1948170.html
Copyright © 2020-2023  润新知