WEB菜单

原创 2006年06月06日 13:02:00
 
<SCRIPT  language=JavaScript>  
<!--  
 
function  MM_goToURL()  {  //v3.0  
   var  i,  args=MM_goToURL.arguments;  document.MM_returnValue  =  false;  
   for  (i=0;  i<(args.length-1);  i+=2)  eval(args[i]+".location='"+args[i+1]+"'");  
}  
function  JM_cc(ob){  
var  obj=MM_findObj(ob);  if  (obj)  {    
obj.select();js=obj.createTextRange();js.execCommand("Copy");}  
}  
 
function  MM_findObj(n,  d)  {  //v4.0  
   var  p,i,x;    if(!d)  d=document;  if((p=n.indexOf("?"))>0&&parent.frames.length)  {  
       d=parent.frames[n.substring(p+1)].document;  n=n.substring(0,p);}  
   if(!(x=d[n])&&d.all)  x=d.all[n];  for  (i=0;!x&&i<d.forms.length;i++)  x=d.forms[i][n];  
   for(i=0;!x&&d.layers&&i<d.layers.length;i++)  x=MM_findObj(n,d.layers[i].document);  
   if(!x  &&  document.getElementById)  x=document.getElementById(n);  return  x;  
}  
//-->  
</SCRIPT>  
<SCRIPT  language=JavaScript>  
<!--  
 
menuPrefix  =  'menu';    //  Prefix  that  all  menu  layers  must  start  with  
                                           //  All  layers  with  this  prefix  will  be  treated  
                                           //  as  a  part  of  the  menu  system.  
 
var  menuTree,  mouseMenu,  hideTimer,  doHide;  
 
function  init()  {  
   ie4  =  (document.all)?true:false;  
   ns4  =  (document.layers)?true:false;  
   document.onmousemove  =  mouseMove;  
   if  (ns4)  {  document.captureEvents(Event.MOUSEMOVE);  }  
}  
 
function  expandMenu(menuContainer,subContainer,menuLeft,menuTop)  {  
           //  Hide  all  submenus  thats's  not  below  the  current  level  
           doHide  =  false;  
   if  (menuContainer  !=  menuTree)  {  
               if  (ie4)  {  
           var  menuLayers  =  document.all.tags("DIV");  
           for  (i=0;  i<menuLayers.length;  i++)  {  
               if  ((menuLayers[i].id.indexOf(menuContainer)  !=  -1)  &&  (menuLayers[i].id  !=  menuContainer))  {  
                   hideObject(menuLayers[i].id);  
               }  
           }  
       }  
       else  if  (ns4)  {  
           for  (i=0;  i<document.layers.length;  i++)  {  
               var  menuLayer  =  document.layers[i];  
               if  ((menuLayer.id.indexOf(menuContainer)  !=  -1)  &&  (menuLayer.id  !=  menuContainer))  {  
                   menuLayer.visibility  =  "hide";  
               }  
           }  
       }  
   }  
   //  If  this  is  item  has  a  submenu,  display  it,  or  it  it's  a  toplevel  menu,  open  it  
   if  (subContainer)  {  
       if  ((menuLeft)  &&  (menuTop))  {  
                   positionObject(subContainer,menuLeft,menuTop);  
                   hideAll();  
       }  
       else  {  
           if  (ie4)  {  
                       positionObject(subContainer,  document.all[menuContainer].offsetWidth  +  document.all[menuContainer].style.pixelLeft  -  10,  mouseY);  
           }  
           else  {  
                       positionObject(subContainer,  document.layers[menuContainer].document.width  +  document.layers[menuContainer].left  +  50,  mouseY);  
           }  
       }  
       showObject(subContainer);  
       menuTree  =  subContainer;  
   }  
}  
 
function  showObject(obj)  {  
   if  (ie4)  {  document.all[obj].style.visibility  =  "visible";  }  
   else  if  (ns4)  {  document.layers[obj].visibility  =  "show";    }  
}  
 
function  hideObject(obj)  {  
   if  (ie4)  {  document.all[obj].style.visibility  =  "hidden";  }  
   else  if  (ns4)  {  document.layers[obj].visibility  =  "hide";  }  
}  
 
function  positionObject(obj,x,y)  {  
   if  (ie4)  {  
       var  foo  =  document.all[obj].style;  
       foo.left  =  x;  
       foo.top  =  y;  
   }  
   else  if  (ns4)  {  
       var  foo  =  document.layers[obj];  
       foo.left  =  x;  
       foo.top  =  y;  
     }  
}  
 
function  hideAll()  {  
 if  (ie4)  {  
       var  menuLayers  =  document.all.tags("DIV");  
       for  (i=0;  i<menuLayers.length;  i++)  {  
           if  (menuLayers[i].id.indexOf(menuPrefix)  !=  -1)  {  
               hideObject(menuLayers[i].id);  
           }  
       }  
   }  
   else  if  (ns4)  {  
       for  (i=0;  i<document.layers.length;  i++)  {  
           var  menuLayer  =  document.layers[i];  
           if  (menuLayer.id.indexOf(menuPrefix)  !=  -1)  {  
               hideObject(menuLayer.id);  
           }  
       }  
   }  
}  
 
function  hideMe(hide)  {  
           if  (hide)  {  
                       if  (doHide)  {  hideAll();  }  
           }  
           else  {  
                       doHide  =  true;  
                       hideTimer  =  window.setTimeout("hideMe(true);",  1000);  
           }  
}  
 
function  mouseMove(e)  {  
   if  (ie4)  {  mouseY  =  window.event.y;  }  
   if  (ns4)  {  mouseY  =  e.pageY;  }  
}  
 
function  itemHover(obj,src,text,style)  {  
   if  (ns4)  {  
       var  text  =  '<nobr><a  href="'  +  src  +  '"  class="'  +  style  +  '">'  +  text  +  '<//a><//nobr>'  
       obj.document.open();  
       obj.document.write(text);  
       obj.document.close();  
   }  
}  
 
onload  =  init;  
//-->  
</SCRIPT>  
<style  type=text/css>  
<!--  
.menu                                              {  position:  absolute;  top:  2;  
                                                         visibility:  hidden;  background:  #000000;  
                                                         width:  79px;  margin:  0px  0px;  padding:  0px  0px;  
                                                         border:  1px  silver  solid;  
                                                         overflow:  visible;  ;  clip:      rect(      )}  
.menu  a:visited                          {  font-family:  "Tahoma";  font-size:  11px;  
                                                         text-decoration:  none;  font-weight:  normal;  
                                                         background:  #ffffff;  
                                                         width:  79px;  padding-left:  8px;  ;  line-height:  22px;    
                                                         border-color:  #000000  ;  border-style:  solid;    
                                                         border-width:  1px;  clip:    rect(      )}  
.menu  a:hover                              {  font-family:  "Tahoma";  font-size:  11px;  
                                                         text-decoration:  none;  font-weight:  normal;  
                                                         background:  #D6DFE7;  color:  #000000;  
                                                         width:  79px;  padding-left:  8px;  ;  line-height:  22px;    
                                                         clip:    rect(      )}  
.menu  .border                              {  border:  1px  solid  #D6DFE7;}  
.menu  .text                                  {  overflow:  hidden;  
                                                         width:  79px;  height:  15px;  }  
.menu  .arrow                                {  overflow:  hidden;  
                                                         width:  15px;  height:  12px;  
                                                         padding-left:  5px;  padding-top:  3px;  }  
.menu  .arrow  img                        {  width:  6px;  height:  7px;  
                                                         border:  0px;  }    .menu  a  {  font-family:  "Tahoma";    
                                                         font-size:  11px;  
                                                         text-decoration:  none;  font-weight:  normal;  
                                                         color:  black;  background:  #ffffff;  
                                                         width:  79px;  padding-left:  8px;      
                                                         clip:    rect(      );  border-color:  #000000;    
                                                         border-style:  solid;  border-width:  1px;  line-height:  22px}  .menu  a:link                                {  color:  #000000;  text-decoration:  none}  
 
.a  {    font-size:  12px;  text-decoration:  none}  
a:link  {    color:  #000000;  text-decoration:  none}  
a:hover  {    text-decoration:  underline}  
a:visited  {    color:  #000000;  text-decoration:  none;}  
-->  
</style>  
<div  align="center">  
<table  width="85%"  border="0"  cellspacing="1"  bgcolor="#D6DFE7"  class="docbutton">  
                 
                   <tr>    
                       <td  bgcolor="#D6DFE7"  height="30"  width="165">&nbsp;<img  src="../pic/point.gif"  width="13"  height="13"  border="0"></td>  
                       <td  bgcolor="#D6DFE7"  height="30"><div  align="right"><a  href="#;"    onMouseOver="expandMenu(null,'menu1',getPos(this,'Left'),getPos(this,'Top')+this.offsetHeight);"  class="a"  >图片管理

Web 页面的菜单

折腾了好久的菜单,终于弄好了,发现了一个恶心的 东西,asp.net中的menu控件在Framework 3.5中生成Table,在Framework4中生成ul li     先上一个在3.5...
  • huanglan513
  • huanglan513
  • 2012年06月05日 13:52
  • 1636

JavaWeb框架设计之菜单设计

JavaWeb框架设计之菜单设计
  • u011097980
  • u011097980
  • 2016年11月24日 19:31
  • 1856

在web里显示各种菜单

web上用javascript实现的各种菜单在web上出现的菜单,常见的的无非两种,一则,如win菜单,鼠标移动上去或者单击时候弹出, 二则。如资源管理器中的树目录结构 ,具体效果如下显示: win式...
  • owl2008
  • owl2008
  • 2005年11月22日 17:20
  • 1410

webmenu编程精彩历程(三)菜单样式设计

我们的菜单样式完全模仿windowxp的蓝色主题的效果,所以大家可以看看windowxp的蓝色主题来体会实际的效果在Menutest.htm里面,我们曾经写过这些代码:1。2。其中第一个是给页面链接一...
  • KimYoo
  • KimYoo
  • 2004年11月14日 00:03
  • 2198

一个web左侧菜单例子

图图: 码码: $(function(){ $(".st_tree").SimpleTree({ click:function(a){ if(!...
  • bcbobo21cn
  • bcbobo21cn
  • 2015年09月17日 10:25
  • 2041

WEB开发中的右键自定义菜单

项目需要一个右键自定义的菜单,包括一些常用的功能,在网上搜索到一个代码,感觉效果不错,放在此处供大家使用,代码版权归原作者所有下面看看我使用的效果图: 代码包括2个文件: JS代码文件menu0.js...
  • j_jake
  • j_jake
  • 2007年11月30日 13:02
  • 1644

WEB入门.九 导航菜单

学习内容水平导航菜单垂直导航菜单下拉式导航菜单能力目标制作tab标签导航菜单制作带箭头的导航菜单制作带信息提示的导航菜单制作垂直下拉导航菜单制作水平下拉导航菜单本章简介上一章节中讲解了 backgro...
  • zhangchen124
  • zhangchen124
  • 2017年02月19日 08:54
  • 1568

web前端,html+css+jquery实现竖直菜单

用到的知识点: 1 列表,常用属性 2 a元素,常用属性 3 显示隐藏 4 jquery点击事件,划过事件 效果: html: html> html> head lang="en">...
  • zhaihaohao1
  • zhaihaohao1
  • 2015年09月27日 14:02
  • 528

JavaScript特效——联动菜单

博主昨天发布了一篇关于JavaScript特效的文章,今天呢给大家带来联动菜单特效,这可能是一个系列哦!...
  • baochao95
  • baochao95
  • 2016年08月16日 13:21
  • 431

web前端-二级分类菜单(类似购物网站)

效果:鼠标移上去右边显示二级菜单。 效果图: 实现代码 html> html> head lang="en"> meta charset="UTF-8"> title...
  • liona_koukou
  • liona_koukou
  • 2016年07月19日 18:05
  • 842
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:WEB菜单
举报原因:
原因补充:

(最多只允许输入30个字)