zoukankan      html  css  js  c++  java
  • 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;
    }
    }

  • 相关阅读:
    Django 【第十二篇】Form组件进阶
    Django 【第十一篇】Form组件基础
    前端知识点总结
    vue组件续和前端工程化
    vue组件
    Vue视图下
    Vue实例与渲染
    BootStrap
    jQuery事件与动画
    dom操作 属性操作 样式操作
  • 原文地址:https://www.cnblogs.com/xkzy/p/3825839.html
Copyright © 2011-2022 走看看