• Js向上展开半透明菜单代码


    代码简介:

    向上展开的半透明菜单,展开菜单后是可以看到背景的哦,透明度自己设置一下,风格有点类似XP系统的右键菜单一样,链接颜色什么的你需要自己修改一下,以适合你的网页风格。

    代码内容:

    <HTML>
    <HEAD>
    <title>Js向上展开半透明菜单代码_网页代码站(www.webdm.cn)</title>
    <STYLE>
    body{
    background:url(http://www.webdm.cn/images/20090919/bgdemo3.jpg);
    }
    .menuover {
    BORDER-RIGHT: #1a71e6 1px solid; BORDER-TOP: #1a71e6 1px solid; BORDER-LEFT: #1a71e6 1px solid; CURSOR: hand; BORDER-BOTTOM: #1a71e6 1px solid; 
    
    BACKGROUND-COLOR: #eaf2fd
    }
    .menuout {
        CURSOR: hand
    }
    TD {
        FONT-SIZE: 12px; COLOR: #1a71e6;TEXT-DECORATION: none
    }
    A {
        FONT-SIZE: 12px; COLOR: #1a71e6; ‘TEXT-DECORATION: none
    }
    </STYLE>
    <SCRIPT>
    var moveStep = 15; // 移动单位
    var moveTime = 10; //移动时间
    function MoveMenuBox()
    {
     if(MenuBox.doing)
     {
      clearInterval(MenuBox.doing)
     }
     
     moveStep *= -1
     
     MenuBox.doing = setInterval("DoMoveAction()",moveTime)
    }
    function DoMoveAction()
    {
     var judger = MenuBox.style.pixelTop + moveStep;
     if(moveStep>0)
     {
      if(judger <= MenuBox.parentElement.offsetHeight)
      {
       MenuBox.style.pixelTop = judger
      }
      else
      {
       MenuBox.style.pixelTop = MenuBox.parentElement.offsetHeight;
       clearInterval(MenuBox.doing);
       MenuBox.doing = false;
      }
     }
     else
     {
      if(judger >= 0)
      {
       MenuBox.style.pixelTop = judger
      }
      else
      {
       MenuBox.style.pixelTop = 0;
       clearInterval(MenuBox.doing);
       MenuBox.doing = false;
      } 
     }
    }
    </SCRIPT>
    </HEAD>
    <BODY>
    <TABLE cellSpacing=0 cellPadding=0 border=0>
      <TBODY>
      <TR>
        <TD width="100%">
          <DIV style="OVERFLOW: hidden; WIDTH: 100%; HEIGHT: 100%">
          <TABLE id=MenuBox 
          style="BORDER-RIGHT: #1a71e6 1px solid; BORDER-TOP: #1a71e6 1px solid; VISIBILITY: hidden; BORDER-LEFT: #1a71e6 20px solid; BORDER-BOTTOM: 
    
    #1a71e6 1px solid; POSITION: relative" 
          cellSpacing=4 cellPadding=0 width=130>
            <TBODY>
            <TR>
              <TD class=menuout onmouseover="this.className='menuover';" 
              onmouseout="this.className='menuout';" vAlign=center align=middle 
              height=20>关于我们</TD></TR>
            <TR>
              <TD class=menuout onmouseover="this.className='menuover';" 
              onmouseout="this.className='menuout';" vAlign=center align=middle 
              height=20>广告服务</TD></TR>
            <TR>
              <TD class=menuout onmouseover="this.className='menuover';" 
              onmouseout="this.className='menuout';" vAlign=center align=middle 
              height=20>用户留言</TD></TR>
            <TR>
              <TD class=menuout onmouseover="this.className='menuover';" 
              onmouseout="this.className='menuout';" vAlign=center align=middle 
              height=20>下载排行</TD></TR>
            <TR>
              <TD class=menuout onmouseover="this.className='menuover';" 
              onmouseout="this.className='menuout';" vAlign=center align=middle 
              height=20>最新更新</TD></TR>
            <TR>
              <TD class=menuout onmouseover="this.className='menuover';" 
              onmouseout="this.className='menuout';" vAlign=center align=middle 
              height=20>网页特效</TD></TR>
            <TR>
              <TD class=menuout onmouseover="this.className='menuover';" 
              onmouseout="this.className='menuout';" vAlign=center align=middle 
              height=20>源码下载</TD></TR>
            <TR>
              <TD class=menuout onmouseover="this.className='menuover';" 
              onmouseout="this.className='menuout';" vAlign=center align=middle 
              height=20>网页代码站</TD></TR></TBODY></TABLE></DIV></TD></TR>
      <TR>
        <TD width="100%">
          <TABLE id=judgerBox height=29 cellSpacing=0 cellPadding=0 width=130>
            <TBODY>
            <TR>
              <TD style="FONT-SIZE: 6px" vAlign=center align=middle width=128 
              bgColor=#ffffff height=4></TD></TR>
            <TR>
              <TD 
              style="BORDER-RIGHT: #ffffff 1px outset; BORDER-TOP: #ffffff 1px outset; BORDER-LEFT: #ffffff 1px outset; CURSOR: hand; COLOR: 
    
    #ffffff; BORDER-BOTTOM: #ffffff 1px outset; BACKGROUND-COLOR: #1a71e6" 
              onclick=MoveMenuBox() vAlign=center align=middle width=128 
                height=25>打开菜单</TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>
    <SCRIPT>
    function window.onload()
    {
     MenuBox.style.pixelTop = MenuBox.parentElement.offsetHeight;
     MenuBox.style.visibility = "visible"
    }
    </SCRIPT>
    <br>
    <p><a href="http://www.webdm.cn">网页代码站</a> - 最专业的代码下载网站 - 致力为中国站长提供有质量的代码!</p>
    

    代码来自:http://www.webdm.cn/webcode/7bd9ac64-22ba-4c2f-8901-3c0c0bb3a11a.html

  • 相关阅读:
    《ACM国际大学生程序设计竞赛题解I》——6.8
    数据结构篇
    从SG函数浅谈解决博弈问题的通法
    动态规划的泛式解题思路
    bzoj1057: [ZJOI2007]棋盘制作
    bzoj3884: 上帝与集合的正确用法
    bzoj1564: [NOI2009]二叉查找树
    bzoj4347: [POI2016]Nim z utrudnieniem
    bzoj1131: [POI2008]Sta
    bzoj1566: [NOI2009]管道取珠
  • 原文地址:https://www.cnblogs.com/webdm/p/1979457.html
Copyright © 2020-2023  润新知