1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283 |
- //折叠菜单命名空间
- Namespace.register("U.Control.FoldMenu");
- /*
- //创建控件函数
- //data 自定义折叠菜单控件数据
- /*
- // var data = [
- // { text: '菜单1', submenu: { text: ['子菜单1', '子菜单2', '子菜单3', '子菜单4', '子菜单5']} },
- // { text: '菜单2', submenu: { text: ['子菜单1', '子菜单2', '子菜单3', '子菜单4', '子菜单5']} }
- // {......}
- // ];
- // text 菜单名字
- // submenu 是否有子菜单,没有可不写
- */
- //container容器
- //*/
- U.Control.FoldMenu.CreateElement = function (data, container) {
- if (!data) {
- var data = [
- { text: '菜单1', submenu: { text: ['子菜单1', '子菜单2', '子菜单3', '子菜单4', '子菜单5']} },
- { text: '菜单2', submenu: { text: ['子菜单1', '子菜单2', '子菜单3', '子菜单4', '子菜单5']} }
- ];
- }
- if (data.length) {
- var nav = $$("div", { "class": "U_Control_FoldMenu_nav" }, container); //创建控件最外层元素
- var ul = $$("ul", { "class": "U_Control_FoldMenu_main_menu" }, nav); //创建控件ul元素
- for (var i = 0; i < data.length; i++) {//循环判断
- var li = $$("li", {}, ul); //创建li元素
- var a_menu_title = $$("a", { "class": "U_Control_FoldMenu_menu_title" }, li); //创建ayuans
- a_menu_title.onclick = function () { U.Control.FoldMenu.Lishow(this); } //赋值a元素点击事件
- var img = $$("img", { "class": "U_Control_FoldMenu_Icon", 'src': 'http://d.1473.cn/controls/pc/FoldingMenu/Demo1/img/JT.png' }, a_menu_title); //创建控件菜单箭头元素
- var spna = $$("span", { "innerHTML": data[i].text }, a_menu_title); //创建控件菜单名字
- if (data[i].submenu.text.length) {//判断是否有子菜单
- var sub_menu_ul = $$("ul", { "class": "U_Control_FoldMenu_sub_menu", "style": { "height": "0"} }, li); //创建子菜单ul元素
- for (var j = 0; j < data[i].submenu.text.length; j++) {
- var li = $$("li", {}, sub_menu_ul);
- var a = $$("a", { "innerHTML": data[i].submenu.text[j] }, li);
- }
- }
- }
- }
- return nav;
- }
- /*
- //子菜单显示函数
- //e 事件源元素(event对象)
- */
- U.Control.FoldMenu.Lishow = function (e) {
- var menu = e.parentNode.getElementsByTagName("ul")[0];
- if (menu) {
- if (menu.style.height=="0px") {
- for (var i = 0; i < $(".U_Control_FoldMenu_main_menu ul").length; i++) {
- $(".U_Control_FoldMenu_main_menu ul")[i].style.height = "0px";
- U.Control.FoldMenu.TS($(".U_Control_FoldMenu_menu_title")[i],0);
- $(".U_Control_FoldMenu_menu_title")[i].className = "U_Control_FoldMenu_menu_title";
- }
- menu.style.height = menu.getElementsByTagName("li").length * 30 + 'px';
- e.className +=" U_Control_FoldMenu_menu_title_active";
- U.Control.FoldMenu.TS(e,90);
- }
- else {
- menu.style.height = 0;
- U.Control.FoldMenu.TS(e,0);
- //$(".U_Control_FoldMenu_menu_title")[i].className = "U_Control_FoldMenu_menu_title";
- e.className = "U_Control_FoldMenu_menu_title";
- }
- }
- }
- /*
- //图片旋转样式改变函数
- //目标对象
- //n 旋转度数
- */
- U.Control.FoldMenu.TS=function(e,n){
- e.getElementsByTagName("img")[0].style.webkitTransform="rotate("+n+"deg)";
- e.getElementsByTagName("img")[0].style.MozTransform="rotate("+n+"deg)";
- e.getElementsByTagName("img")[0].style.msTransform="rotate("+n+"deg)";
- e.getElementsByTagName("img")[0].style.OTransform="rotate("+n+"deg)";
- e.getElementsByTagName("img")[0].style.transform="rotate("+n+"deg)";
- }
|