JS树形菜单共享
JS树形菜单共享
[功能介绍]
--------------------------------------------------------------------------------
1.无限级分类
2.可用于内嵌框架
3.自动记录状态(跳转页面后目录仍然保持最后状态不会还原成全部折叠)
4.可在一个页面上存在多个DTREE
5.支持所有常用浏览器
√Internet Explorer 5+
√Netscape 6+
√Opera 7+
√Mozilla
6.符合XHTML 1.0
7.可替换图片
[使用方法]
推广使用到BLOG中,防止了侧边栏的冗长.
1.将提供的下载文件和文件夹分别上传至BLOG根目录.
2.将以下代码填入<head></head>区域
CODE:
3.将以下格式代码填入你要放置的模块或某位置
CODE:
4.对于代码的部分解析:
CODE:
5.大家可根据自己喜好替换图
默认的一级分类文件夹和文件图片分别为folder.gif和page.gif,大家只能是替换图片
上面的 ,'Search','','','img/imgfolder.gif' 后续补充图片是指该栏目被展开时的图片.
只有在加了此句的时候,展开时会显示相对应的图片,否则显示为默认的展开图片folderopen.gif
故如有需要亦需替换此图片.
6.充分利用Tags
此目录提供的细节分类十分有用,但我不赞成大家把blog的分类设太多,故大家可以充分利用tag来做最小级分类.本blog的链接页面建议大家使用相对路径.
--------------------------------------------------------------------------------
1.无限级分类
2.可用于内嵌框架
3.自动记录状态(跳转页面后目录仍然保持最后状态不会还原成全部折叠)
4.可在一个页面上存在多个DTREE
5.支持所有常用浏览器
√Internet Explorer 5+
√Netscape 6+
√Opera 7+
√Mozilla
6.符合XHTML 1.0
7.可替换图片
[使用方法]
推广使用到BLOG中,防止了侧边栏的冗长.
1.将提供的下载文件和文件夹分别上传至BLOG根目录.
2.将以下代码填入<head></head>区域
<link rel="StyleSheet" href="/dtree.css" type="text/css" /></>< type="text/java" src=\'#\'" /><style type="text/css">dtree { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; font-size: 11px; white-space: nowrap;}.dtree img { border: 0px; vertical-align: middle;}.dtree a { text-decoration: none;}.dtree a.node, .dtree a.nodeSel { white-space: nowrap; padding: 1px 2px 1px 2px;}dtree .clip { overflow: hidden;}</style>
3.将以下格式代码填入你要放置的模块或某位置
<div style="line-height:9px">
<p align="right"><a href="java: d.openAll();">全部展开</a> | <a href="java: d.closeAll();">全部折叠</a></p>
< type="text/java">
<!--
d = new dTree('d');
d.add(0,-1,'ShadowSky V7.0');
d.add(1,0,'返回首页','index.php','Index','','','img/imgfolder.gif');
d.add(2,0,'会员登陆','login.php','Login','','','img/imgfolder.gif');
d.add(3,2,'登陆','login.php');
d.add(4,2,'注册','login.php?job=register');
d.add(5,2,'查看所有用户','view.php?go=userlist');
d.add(6,0,'留言本','guestbook.php','GuestBook','','','img/imgfolder.gif');
d.add(7,6,'发表留言','guestbook.php');
d.add(8,6,'查看所有评论','view.php?go=comment');
d.add(9,0,'日记','index.php?go=category_17','Diary','','','img/imgfolder.gif');
d.add(10,9,'网易日记本(2004)','tag.php?tag=');
d.add(11,9,'MSN空间(2005)','tag.php?tag=msnspaces');
d.add(12,9,'日记|感悟','index.php?go=category_17');
d.add(13,9,'文摘|其他','index.php?go=category_22');
d.add(14,0,'相册','index.php?go=category_30','PhotoAlbum','','','img/imgfolder.gif');
d.add(15,0,'模板','index.php?go=category_13','Bo-Blog Skin','','','img/imgfolder.gif');
d.add(16,15,'少女系列','tag.php?tag');
d.add(17,15,'圣域系列','tag.php?tag=');
d.add(18,15,'其他综合','tag.php?tag=shadowsky-skin');
d.add(19,15,'移植模板','tag.php?tag=');
d.add(20,0,'设计','index.php?go=category_16','Design','','','img/imgfolder.gif');
d.add(21,20,'PhotoShop','tag.php?tag=photoshop');
d.add(22,21,'PhotoShop资源','tag.php?tag=');
d.add(23,22,'笔刷','tag.php?tag=photoshop-brush');
d.add(24,22,'图案','read.php?366');
d.add(25,22,'样式','read.php?373');
d.add(26,22,'蒙板','read.php?362');
d.add(27,22,'字体','tag.php?tag=');
d.add(28,22,'指针','read.php?293');
d.add(29,21,'PhotoShop教程','tag.php?tag=photoshop%E6%95%99%E7%A8%8B');
d.add(30,20,'Bo-Blog相关','tag.php?tag=bo-blog%E7%9B%B8%E5%85%B3');
d.add(31,20,'Web相关','index.php?go=category_16');
d.add(32,20,'工具软件','tag.php?tag=%E4%B8%8B%E8%BD%BD');
d.add(33,20,'素材','<a href="" target="_blank">http://www.u1u1.net/');</a>');
d.add(34,0,'搜索','index.php','Search','','','img/imgfolder.gif');
d.add(35,34,'搜索博客','index.php');
d.add(36,34,'搜索整站','index.php');
d.add(37,0,'其他','index.php?go=category_31','Other','','','img/imgfolder.gif');
d.add(38,37,'关于源子','read.php?136');
d.add(39,37,'网站地图','read.php?134');
d.add(40,37,'友情链接','view.php?go=links');
d.add(41,37,'手机浏览','<a href="http://www.u8u8.net/">手机浏览</a>');
d.add(42,37,'订阅','feed.php');
d.add(43,42,'订阅全站','feed.php');
d.add(44,42,'日记分类','feed.php?go=category_17');
d.add(45,42,'相册分类','feed.php?go=category_30');
d.add(46,42,'模板分类','feed.php?go=category_13');
d.add(47,42,'设计分类','feed.php?go=category_16');
d.add(48,37,'源子求助','tag.php?tag=');
d.add(49,37,'站内更新','read.php?226');
d.add(50,37,'全部标签','tag.php');
d.add(51,37,'广告征订','read.php?389');
write(d);
//-->
</>
</div>
<p align="right"><a href="java: d.openAll();">全部展开</a> | <a href="java: d.closeAll();">全部折叠</a></p>
< type="text/java">
<!--
d = new dTree('d');
d.add(0,-1,'ShadowSky V7.0');
d.add(1,0,'返回首页','index.php','Index','','','img/imgfolder.gif');
d.add(2,0,'会员登陆','login.php','Login','','','img/imgfolder.gif');
d.add(3,2,'登陆','login.php');
d.add(4,2,'注册','login.php?job=register');
d.add(5,2,'查看所有用户','view.php?go=userlist');
d.add(6,0,'留言本','guestbook.php','GuestBook','','','img/imgfolder.gif');
d.add(7,6,'发表留言','guestbook.php');
d.add(8,6,'查看所有评论','view.php?go=comment');
d.add(9,0,'日记','index.php?go=category_17','Diary','','','img/imgfolder.gif');
d.add(10,9,'网易日记本(2004)','tag.php?tag=');
d.add(11,9,'MSN空间(2005)','tag.php?tag=msnspaces');
d.add(12,9,'日记|感悟','index.php?go=category_17');
d.add(13,9,'文摘|其他','index.php?go=category_22');
d.add(14,0,'相册','index.php?go=category_30','PhotoAlbum','','','img/imgfolder.gif');
d.add(15,0,'模板','index.php?go=category_13','Bo-Blog Skin','','','img/imgfolder.gif');
d.add(16,15,'少女系列','tag.php?tag');
d.add(17,15,'圣域系列','tag.php?tag=');
d.add(18,15,'其他综合','tag.php?tag=shadowsky-skin');
d.add(19,15,'移植模板','tag.php?tag=');
d.add(20,0,'设计','index.php?go=category_16','Design','','','img/imgfolder.gif');
d.add(21,20,'PhotoShop','tag.php?tag=photoshop');
d.add(22,21,'PhotoShop资源','tag.php?tag=');
d.add(23,22,'笔刷','tag.php?tag=photoshop-brush');
d.add(24,22,'图案','read.php?366');
d.add(25,22,'样式','read.php?373');
d.add(26,22,'蒙板','read.php?362');
d.add(27,22,'字体','tag.php?tag=');
d.add(28,22,'指针','read.php?293');
d.add(29,21,'PhotoShop教程','tag.php?tag=photoshop%E6%95%99%E7%A8%8B');
d.add(30,20,'Bo-Blog相关','tag.php?tag=bo-blog%E7%9B%B8%E5%85%B3');
d.add(31,20,'Web相关','index.php?go=category_16');
d.add(32,20,'工具软件','tag.php?tag=%E4%B8%8B%E8%BD%BD');
d.add(33,20,'素材','<a href="" target="_blank">http://www.u1u1.net/');</a>');
d.add(34,0,'搜索','index.php','Search','','','img/imgfolder.gif');
d.add(35,34,'搜索博客','index.php');
d.add(36,34,'搜索整站','index.php');
d.add(37,0,'其他','index.php?go=category_31','Other','','','img/imgfolder.gif');
d.add(38,37,'关于源子','read.php?136');
d.add(39,37,'网站地图','read.php?134');
d.add(40,37,'友情链接','view.php?go=links');
d.add(41,37,'手机浏览','<a href="http://www.u8u8.net/">手机浏览</a>');
d.add(42,37,'订阅','feed.php');
d.add(43,42,'订阅全站','feed.php');
d.add(44,42,'日记分类','feed.php?go=category_17');
d.add(45,42,'相册分类','feed.php?go=category_30');
d.add(46,42,'模板分类','feed.php?go=category_13');
d.add(47,42,'设计分类','feed.php?go=category_16');
d.add(48,37,'源子求助','tag.php?tag=');
d.add(49,37,'站内更新','read.php?226');
d.add(50,37,'全部标签','tag.php');
d.add(51,37,'广告征订','read.php?389');
write(d);
//-->
</>
</div>
4.对于代码的部分解析:
d.add(1,0,'返回首页','index.php','Index','','','img/imgfolder.gif');
d.add(x,y,'z','url','alt',",",'img-url');
x是每个项目独立的ID,不能重复,从顶级目录向下依次0,1,2......
y是此目录归属的上级目录的ID.顶级目录为-1,一级目录写0,二级目录写所属一级目录的ID...
z是目录的文字
url是相应的链接指向页面,可为绝对也可为相对,若为绝对路径前面不能省略"http://"
alt是图片所在行文字的注释
img-url是图片的路径.
注意 ,'Search','','','img/imgfolder.gif' 此句并非必须.而且只有在仍有下级目录时才生效.
d.add(x,y,'z','url','alt',",",'img-url');
x是每个项目独立的ID,不能重复,从顶级目录向下依次0,1,2......
y是此目录归属的上级目录的ID.顶级目录为-1,一级目录写0,二级目录写所属一级目录的ID...
z是目录的文字
url是相应的链接指向页面,可为绝对也可为相对,若为绝对路径前面不能省略"http://"
alt是图片所在行文字的注释
img-url是图片的路径.
注意 ,'Search','','','img/imgfolder.gif' 此句并非必须.而且只有在仍有下级目录时才生效.
5.大家可根据自己喜好替换图
默认的一级分类文件夹和文件图片分别为folder.gif和page.gif,大家只能是替换图片
上面的 ,'Search','','','img/imgfolder.gif' 后续补充图片是指该栏目被展开时的图片.
只有在加了此句的时候,展开时会显示相对应的图片,否则显示为默认的展开图片folderopen.gif
故如有需要亦需替换此图片.
6.充分利用Tags
此目录提供的细节分类十分有用,但我不赞成大家把blog的分类设太多,故大家可以充分利用tag来做最小级分类.本blog的链接页面建议大家使用相对路径.