javascript（竖版）树形菜单实例（比较高级3.1）

GODdaughter

浏览: 105438 次
性别:
来自: 北京

最近访客更多访客>>

liaobuzhisi

mycream

caichengo

浮生一如梦

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

javascript

JavaScript IE HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>tree menu by jiarry</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script language="JavaScript" type="text/JavaScript">
<!--//made by jiarry.126.com Aug.27 2004
function showhide_obj(obj,icon)
{
obj=document.getElementById(obj);
icon=document.getElementById(icon);
//objStr=obj.toString(); 
//alert(objStr)
/*objStr=2;
a=objStr.toString()+5;
b=objStr+5
alert(a);alert(b);
*/

 if (obj.style.display=="none")
  { 
    //div_list = document.all.tags("div"); //指定文档中的对象为div,仅适用于IE;  
    div_list = document.getElementsByTagName("div");
    for (i=0; i< div_list.length; i ++) {
      thisDiv = div_list[i];
   if(thisDiv.id.indexOf("title")!=-1)//当文档div中的id含有list时,与charAt类似;
   {
   //if(obj.id!=obj)//该div 的id又非选中的obj,设置该div的style为none
   //{
   thisDiv.style.display="none";//循环吧所有菜单链接都隐藏起来
  // }
   }
 }
 
 
    //myfont=document.all.tags("font");
   myfont=document.getElementsByTagName("font");
   for(i=0;i<myfont.length;i++)
    {
    thisfont = myfont[i];
    if(thisfont.id.indexOf("icon")!=-1 && icon.id!=icon)
    {  
    //alert(thisfont.id)
    //thisfont.innerHTML="+";
     }
   }
    //icon.innerHTML="-";
    obj.style.display=""; //只显示当前链接
}
 else
  {//假如当前对象是打开的，就关闭它;
   //icon.innerHTML="+";
   obj.style.display="none";
   }
 }

function set_initialization(obj,img)
{//设置初始状态,打开一个层;
   obj.style.display="";
   img.src="images/icon/minus.gif";
   }

function show_this(obj)
{
obj=document.getElementById(obj);
if (obj.id==obj.id)
 {
 //alert(obj.id)
   //blinkicon=document.all.tags("font"); 
   blinkicon=document.getElementsByTagName("font");
   for(x=0;x<blinkicon.length;x++)
    {
    if( blinkicon[x].id.indexOf("select")!=-1 && obj.id!=obj )
      {
       blinkicon[x].innerHTML=" ";
      }
    }
      obj.innerHTML="&gt;";
 }
 else
 {
       obj.innerHTML=" ";
 }
}
//-->
</script>
<style type="text/css">
span{ width:100px;Height:25px;margin-left:15px;}
font{font-weight:bold;}
body,td{font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px;color:#333333;}
div{cursor:default;border-top:1px solid gray ; border-left:1px solid gray ;border-right:1px solid gray ;background-color:#D3F7FE ;width:120px;}
pre{background-color:#FFFFF1; border:1px solid gray;color:blue;font-family:verdana;Arial;padding:20px;}
</style>
</head>

<body>
<p>&nbsp;</p>
<p>&nbsp;</p>
<div style="line-height:25px;" onClick="showhide_obj('title1','icon1')"><font id='icon1'>+</font>railing 1 </div>
<div id="title1"  style="background-color:#fffff3;line-height:22px;display:none;">
<span id=menu1_1 onMouseOver="this.style.backgroundColor='blue'" onMouseOut="this.style.backgroundColor=''" onclick="show_this('select1_1')"><font id='select1_1'></font>menu 1</span></font><br />
<span id="menu1_2" onclick="show_this('select1_2')"><font id='select1_2'></font>menu 2</span></font><br />
<span id="menu1_3" onclick="show_this('select1_3')"><font id='select1_3'></font>menu 3</span></font><br />
</div>
<div style="line-height:25px;" onClick="showhide_obj('title2','icon2')"><font id='icon2'>+</font>railing 2</div>
<div id="title2" style="background-color:#fffff3;line-height:22px;display:none;">
<span id=m"enu2_1" onclick="show_this('select2_1')"><font id='select2_1'></font>menu 1</span></font><br />
<span id="menu2_2" onclick="show_this('select2_2')"><font id='select2_2'></font>menu 2</span></font><br />
<span id="menu2_3" onclick="show_this('select2_3')"><font id='select2_3'></font>menu 3</span></font><br />
</div>
<div style="line-height:25px;" onClick="showhide_obj('title3','icon3')"><font id='icon3'>+</font>railing 3</div>
<div id="title3" style="background-color:#fffff3;line-height:22px;display:none;">
<span id=menu3_1 onclick="show_this('select3_1')"><font id='select3_1'></font>menu 1</span></font><br />
<span id=menu3_2 onclick="show_this('select3_2')"><font id='select3_2'></font>menu 2</span></font><br />
<span id=menu3_3 onclick="show_this('select3_3')"><font id='select3_3'></font>menu 3</span></font><br />
</div>
<div style="line-height:25px;" onClick="showhide_obj('title4','icon4')"><font id='icon4'>+</font>railing 4</div>
<div id="title4" style="background-color:#fffff3;line-height:22px;display:none;">
<span id=menu4_1 onclick="show_this('select4_1')"><font id='select4_1'></font>menu 1</span></font><br />
<span id=menu4_2 onclick="show_this('select4_2')"><font id='select4_2'></font>menu 2</span></font><br />
<span id=menu4_3 onclick="show_this('select4_3')"><font id='select4_3'></font>menu 3</span></font><br />
<span id=menu4_4 onclick="show_this('select4_4')"><font id='select4_4'></font>menu 4</span></font><br />
<span id=menu4_5 onclick="show_this('select4_5')"><font id='select4_5'></font>menu 5</span></font><br />
<span id=menu4_6 onclick="show_this('select4_6')"><font id='select4_6'></font>menu 6</span></font><br />
</div>

</body>
</html>

分享到：

javascript横版的树形菜单实例(网上摘抄2. ... | javascript横版的树形菜单实例(网上摘抄2. ...

2008-08-21 22:14
浏览 1197
评论(0)
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

javascript（竖版）树形菜单实例（比较高级3.1）

评论

发表评论

相关推荐

最近访客 更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

javascript（竖版）树形菜单实例（比较高级3.1）

评论

发表评论

相关推荐

javascript使用中的一些小技巧

按Esc键IE窗口自动关闭[原]

来自：http://hi.baidu.com/zqtie/blog/item/222625d33a5

网上(不好意思，摘抄的时候忘记写地址了)

javascript 无弹出式表单验证

javascript动态填写table中的行和列(1.3)这个很有意思哦

javascript动态填写table中的行和列(1.2)

javascript（竖版）树形菜单实例（3.2）

javascript横版的树形菜单实例(网上摘抄2.2)

javascript横版的树形菜单实例(网上摘抄2.1)

javascript树形菜单实例(简单的1.1)

Javascript 操作select控件大全(来源：网上摘选)

javascript（**文件**）声明

javascript自定义trim()函数(来源：快乐的笛子的博客)

javascipt 验证集锦

javascript 应用的一些小窍门

最近访客更多访客>>

javascript（文件）声明