javascript 树形菜单
1. [代码][JavaScript]代码
var ME={
ini:{i:true,d:{},d1:{},h:0,h1:0,h2:0},
html:function(da,f){
var s='<ul'+(f?' class="f"':'')+'>';
for(var i=0,l=da.length;i<l;i++){
if(typeof(da[i].pid)=='object'){
s+='<li><button type="button" class="+(i==0&&this.ini.i?'s1':(i+1==l?'s5':'s3'))+" onclick="ME.yc(this)"></button><span><button type="button" class="r1"></button><a href="javascript:;">'+da[i].ming+'</a></span>';
this.ini.i=false;
s+=this.html(da[i].pid,(i+1==l));
}else{
s+='<li><button type="button" class="+(i+1==l?'e3':'e1')+"></button><span><button type="button" class="m1"></button><a href="http://www.za90.com" target="mainFrame">'+da[i].ming+'</a></span>';
}
s+='</li>';
}
s+='</ul>';
return s;
},
st:function(id,da){
document.getElementById(id).innerHTML=this.html(da);
},
yc:function(a){
var s=a.className.substr(1);
if(s%2){
this.ini.d=a.parentNode.children[2];
this.ini.h1=this.hei(this.ini.d);
this.ini.h3=this.ini.h1/10;
this.yc1(1);
a.className='s'+(parseInt(s)+1);
a.parentNode.children[1].children[0].className='r2';
var ol=a.parentNode.parentNode._;
if(typeof(ol)=='object'){
this.ini.d1=ol;
this.ini.h=ol.offsetHeight;
this.ini.h2=this.ini.h/10;
this.yc2(1);
ol.parentNode.children[0].className='s'+(parseInt(ol.parentNode.children[0].className.substr(1))-1);
ol.parentNode.children[1].children[0].className='r1';
}http://www.huiyi8.com/css3/
a.parentNode.parentNode._=a.parentNode.children[2];
}else{
this.ini.d1=a.parentNode.children[2];
this.ini.h=this.ini.d1.offsetHeight;
this.ini.h2=this.ini.h/10;
this.yc2(1);
a.className='s'+(parseInt(s)-1);
a.parentNode.children[1].children[0].className='r1';
a.parentNode.parentNode._='';
}
},
yc1:function(b){
var h1=ME.ini.h1-(11/(b+1)-1)*ME.ini.h3;
with(ME.ini.d.style){
height=h1+'px';
display='block';
}css3动画
if(b<10){
setTimeout('ME.yc1('+(b+1)+')',25);
}else{
ME.ini.d.style.display='block';
ME.ini.d.style.height='';
}
},
yc2:function(b){
var h1=(11/(b+1)-1)*ME.ini.h2;
with(ME.ini.d1.style){
height=h1+'px';
}
if(b<10){
setTimeout('ME.yc2('+(b+1)+')',25);
}else{
ME.ini.d1.style.display='';
ME.ini.d1.style.height='';
}
},
hei:function(a){
var b=a.cloneNode(true);
b.style.position='absolute';
b.style.display='block';
b.style.visibility='hidden';
a.parentNode.appendChild(b);
var h=b.offsetHeight;
a.parentNode.removeChild(b);
return h;
}
}
javascript 树形菜单的更多相关文章
- javascript树形菜单简单实例
参考博客地址:http://chengyoyo2006.blog.163.com/blog/static/8451734820087843950604/ <!DOCTYPE HTML PUBLI ...
- 实用的树形菜单控件tree
jQuery plugin: Treeview 这个插件能够把无序列表转换成可展开与收缩的Tree. jQuery plugin: Treeview jQuery jstree jsTree ...
- html树形菜单控件
html树形菜单控件 链接 http://www.ithao123.cn/content-713974.html jQuery plugin: Treeview 这个插件能够把无序 ...
- 【转】html树形菜单控件
Query plugin: Treeview 这个插件能够把无序列表转换成可展开与收缩的Tree. 主页:http://bassistance.de/jQuery-plugins/jquery-pl ...
- jQuery 树形菜单
树形菜单 在 jQuery easyu中其左侧的主菜单使用的是 easyui 中的 tree 组件,不是太熟悉,不过感觉不是太好用. 比如 easyui 中的 tree 需要单击分叉节点前的小三角,才 ...
- 简单实用的二级树形菜单hovertree
原创 hovertree是一个仿京东的树形菜单jquery插件,暂时有银色和绿色两种. 官方网址:http://keleyi.com/jq/hovertree/欢迎下载使用 查看绿色效果:http:/ ...
- WEB开发中前后台树形菜单的展示设计
在WEB开发中经常需要进行树形菜单的展示,本例通过不同角度的总结了如下三种实现方式: 通过JS的递归实现前端菜单DOM的动态创建 通过JSP的include指令结合JSTL表达式语言递归实现菜单的展示 ...
- DWZ中Tree树形菜单的treeCheck如何获取返回值解决方案
最近在对DWZ和asp.net MVC3进行整合,其中遇到了很多问题,总算一一解决了,今天就说说题目所示的问题解决方案. 想做一个基于角色的权限管理,要对每一个Action进行权限控制.就想用DWZ的 ...
- jquery树形菜单完整代码
本实例实现了树形的动态菜单,兼容IE8,火狐,Chrome等浏览器.使用了jQuery的toggle() 方法.效果和代码如下: <!DOCTYPE html PUBLIC "-//W ...
随机推荐
- LeetCode OJ--Partition List
http://oj.leetcode.com/problems/partition-list/ 链表的处理 #include <iostream> using namespace std; ...
- Linux 系统的常用命令之 rm ,rm -rf , rm -f 以及rm 命令的其他参数命令
1.rm -rf * 删除当前目录下的所有文件,这个命令很危险,应避免使用. 所删除的文件,一般都不能恢复! 2.rm -f 其中的,f参数 (f --force ) 忽略不存在的文件,不显示任何信息 ...
- 数字IC设计入门必备——VIM自定义模板调用与VCS基本仿真操作示例
一.前言 毕业论文答辩结束,闲下来写篇文章.芯片研发人员都在Linux系统下借助各种EDA工具和代码语言完成工作,因此提高代码开发效率,熟练运用开发工具是十分必要的.本文讲述VIM编辑神器的veril ...
- 安装 node-sass 的不成功
昨天安装项目依赖的包,差不多都装好了,然后就卡在了node-sass上,各种报错. 报错一.gyp ERR! stack Error: Can't find Python executable &qu ...
- luogu P1704 寻找最优美做题曲线
题目背景 nodgd是一个喜欢写程序的同学,前不久(好像还是有点久了)洛谷OJ横空出世,nodgd同学当然第一时间来到洛谷OJ刷题.于是发生了一系列有趣的事情,他就打算用这些事情来出题恶心大家-- 题 ...
- 迈出从3K到1W的重要一步——掌握设计模式
IT职场的小菜经常有这样的疑问: 为什么一个相似的功能,大牛一会儿就搞定,然后悠闲地品着下午茶逛淘宝:而自己加班加点搞到天亮还做不完. 为什么用户提出需求变更后,大牛只需潇洒地敲敲键盘,改改配置:而自 ...
- 【转】C语言中整型运算取Ceiling问题
原文:http://blog.csdn.net/laciqs/article/details/6662472 --------------------------------------------- ...
- booth乘法器原理
在微处理器芯片中,乘法器是进行数字信号处理的核心,同一时候也是微处理器中进行数据处理的wd=%E5%85%B3%E9%94%AE%E9%83%A8%E4%BB%B6&hl_tag=textli ...
- hadoop优质链接
http://wiki.apache.org/hadoop/FAQ
- RecyclerView的万能切割线
效果图: 用法: 加入默认切割线:高度为2px.颜色为灰色 mRecyclerView.addItemDecoration(new RecycleViewDivider(mContext, Linea ...