您好,欢迎来到模板无忧!
登录
注册
闂傚倸鍊峰ù鍥Υ閳ь剟鏌涚€n偅宕岄柡宀€鍠栭、娑樷堪閸愮偓姣夋俊鐐€戦崕濠氬箯閿燂拷
闂傚倸鍊烽懗鍫曞箠閹捐瑙﹂悗锝庡墮閸ㄦ繈骞栧ǎ顒€濡肩痪鎯с偢閺屻劑鎮ら崒娑橆伓
闂傚倸鍊风欢姘缚婵犳碍鈷旈柛鏇ㄥ亽閻斿棙淇婇姘ュ仺鐟滅増甯楅弲鎼佹煥閻曞倹瀚�
闂傚倷鐒﹂惇褰掑春閸曨垰鍨傚┑鍌溓圭粣妤呮煛瀹ュ啫濡介柛娆忕箻閺屻劑鎮ら崒娑橆伓
模板无忧
网页特效
每日更新
|
TOP排行榜
|
Tag标签
|
充值
无忧首页
网页模板
程序模板
建站教程
视频教程
网页特效
图标素材
字体下载
站长工具
站长问答
关闭顶部
展开顶部
网页特效
菜单导航
图片特效
文本链接
层和布局
页面背景
表单按钮
日期时间
计算转换
键盘鼠标
浏览器
游戏娱乐
综合其它
常用代码
jQuery特效
Prototype
Ajax/JavaScript
ExtJS
CSS特效
在线编辑器
Mootools
HTML
JS广告代码合集
站长工具
站长常用软件
网站综合查询
Alexa排名查询
Google PR查询
域名Whois查询
网站收录查询
友情链接查询
CSS2中文手册
CSS精简优化工具
AI閻忓繐绻楁禒锟� 闁煎疇妫勯崯鎾村濮樿鲸鏆�
闁糕晝鍠庨幃锟�
闁规亽鍔忓畷锟�
展开边栏
关闭边栏
网页特效代码
模板无忧
>
网页特效
>
文本链接特效代码
>
收藏
分享
查看评论
文本链接
演示
链接就像开始菜单一样可分几层_文本链接特效
查看演示效果
特效Tag:
链接
添加
缂備礁娲﹂埅绀慹deCMS閻熸瑥妫濋。鍫曞极濞嗘垟鏌�
濞戞梹澹嗛埞鏍⒒閿燂拷 缂佸鍠愬﹢鍥礉閳ヨ櫕鐝� 闂侇偄顦辩紞澶屾兜閺囨氨闉嶉柤杈ㄦ缁憋拷
闁哄啰濮撮崪鏍博濞嗘挻姣愮€规悶鍎遍崣锟�,闁谎勫劤鐎规娊寮堕崘顔兼濞戞挴鍋撻梺娆惧枛閸欏繘寮婚敓锟�!
链接就像开始菜单一样可分几层,您可以先修改部分代码再运行.
<!--要完成此效果把如下代码加入到<body>区域中--> <SCRIPT> function _init(){ for(var i=0;i<document.all.length;i++){ if(document.all[i].getAttribute("menu")){ var attribs = _eat_attrib(document.all[i].getAttribute("menu")); var tree = new Array(); var src = document.all.item(attribs["src"]).innerText; // get the config info from the mrcs of the designated source element src = _strip(src); // remove whitespace informatin tree = _compile(tree,src); // turn it into a multilevel array // at this time, associate the element the // menu is attached to with the created menuing elements var menuId = _menus.length; document.all[i].menuId = menuId; document.all[i].onmouseover = _rootmouseover; document.all[i].onmouseout = _rootmouseout; // get and preset designer preferences var attribs = _eat_attrib(document.all[i].getAttribute("menu")); attribs["border-width"] = (attribs["border-width"]!=null?attribs["border-width"]:1); attribs["border-color"] = (attribs["border-color"]!=null?attribs["border-color"]:"black"); attribs["background"] = (attribs["background"]!=null?attribs["background"]:"white"); attribs["highlight"] = (attribs["highlight"]!=null?attribs["highlight"]:"#DCDCDC"); attribs["font-size"] = (attribs["font-size"]!=null?attribs["font-size"]:"normal"); attribs["font-family"] = (attribs["font-family"]!=null?attribs["font-family"]:""); attribs["font-color"] = (attribs["font-color"]!=null?attribs["font-color"]:""); attribs["icon-color"] = (attribs["icon-color"]!=null?attribs["icon-color"]:"black"); attribs["arrow"] = (attribs["arrow"]!=null?attribs["arrow"]:true); attribs["showrow"] = (attribs["showrow"]!=null?attribs["showrow"]:true); attribs["height"] = (attribs["height"]!=null?attribs["height"]:22); attribs["width"] = (attribs["width"]!=null?attribs["width"]:150); attribs["arrow-offset"] = (attribs["arrow-offset"]!=null?Number(attribs["arrow-offset"]):135); attribs["menu-offset"] = (attribs["menu-offset"]!=null?Number(attribs["menu-offset"]):1); attribs["menu-topoffset"] = (attribs["menu-topoffset"]!=null?Number(attribs["menu-topoffset"]):0); attribs["wait"] = (attribs["wait"]!=null?Number(attribs["wait"]):500); document.all[i].attribs = attribs; // now, create all of the needed elements for this menu _create(document.all[i],tree); } } } window.onload = _init; ///////////////////////// ///////////////////////// //// takes a position and a string, //// returns the position of the next unpaired "]" character function _pair(after,str){ while(1){ var nextA = str.indexOf("[",after + 1); var nextB = str.indexOf("]",after + 1); if(nextA == -1){ return nextB; } if(nextA > nextB){ return nextB; } after = _pair(nextA,str); } } ///////////////////////// //// transforms raw text input into a multilevel array //// returns an array based on the string input function _compile(ary,str){ while(1){ // keep circling and eating the str // when the str is empty, return the built array if(str.length == 0){ return ary; } // is there any more sub-arrays? var nextA = str.indexOf("["); if(nextA == -1){ var go = str; var spawn = ""; str = ""; }else{ var go = str.substring(0,nextA); var spawn = str.substring(str.indexOf("[") + 1,_pair(str.indexOf("["),str)) str = str.substring(_pair(str.indexOf("["),str) + 1,str.length); } // build a flat array of key/value pairs and strip out the empty elements var A = go.split(";"); var A2 = new Array(); for(var j=0;j<A.length;j++){ if(A[j].indexOf("!") != -1){ A2[A2.length] = A[j]; } } A = A2; // parse the flat array for(var i = 0;i < A.length;i++){ var tmpA = A[i].split("!"); var thisary = ary.length; ary[thisary] = new Array(); // attach a sub array if needed if((i+1)==A.length && spawn.length != ""){ ary[thisary] = _compile(ary[thisary],spawn); } // assign properties to this array based on the parsed array key/value pairs ary[thisary].name = tmpA[0]; ary[thisary].url = tmpA[1]; ary[thisary].desc = tmpA[2]; ary[thisary].icon = tmpA[3]; } } } /////////////////////// /////////////////////// //// Actually draw and initialize elements from the array function _create(e,ary){ var str = new String(); var menuId = _menus.length; // save the ID for this menu str = '<DIV ID="_div_' + menuId // give it a unique name + '" STYLE="visibility:hidden;position:absolute;top:0;left:0;width:' + e.attribs["width"] + ';height:10;background-color:black;">'; e.insertAdjacentHTML("AfterEnd",str); // paste it in below the root element var thismenu = document.all.item("_div_" + menuId); // save a reference to the element object _menus[menuId] = thismenu; // save a reference to the element object in a global array for later use thismenu.menuId = menuId; // tell the element object where it is in the global array thismenu.close = _close; // assign a close function to it thismenu.menuParent = null; // initialize some variables to null thismenu.menuChild = null; thismenu.highlightBG = e.attribs["highlight"]; thismenu.normalBG = e.attribs["background"]; thismenu.menuOffset = e.attribs["menu-offset"]; thismenu.menuTopoffset = e.attribs["menu-topoffset"]; thismenu.waitDelay = e.attribs["wait"]; var prevBottom = 0; // initialize where the option elements should start drawing // create a span element for every option for(var i=0;i<ary.length;i++){ str = '<SPAN ID="_link_' // assign a unique name + menuId + '_' + i + '" STYLE="position:absolute;top:' + prevBottom // position it correctly + ';left:0;height:' + e.attribs["height"] + ';overflow:hidden;width:' + e.attribs["width"] + ';background:' + e.attribs["background"] + ';border-width:' + e.attribs["border-width"] + ';border-style:solid;border-color:' + e.attribs["border-color"] + ';'; if(e.attribs["showrow"]!=true && i != 0){ str +='border-top-width:0;'; } str +='text-align:left;font-size:' + e.attribs["font-size"] + ';padding-left:4;">'; if(ary[i].icon!=null){ str +='<SPAN STYLE="font-family:webdings;color:' + e.attribs["icon-color"] + '">&#' + ary[i].icon + ';</SPAN> '; } str +='<A HREF="' + ary[i].url + '" TITLE="' + ary[i].desc + '" STYLE="font-family:' + e.attribs["font-family"] + ';color:' + e.attribs["font-color"] + ';padding-left:3;">' + ary[i].name // fill in the mrc/name + '</A>'; if(ary[i].length > 0 && e.attribs["arrow"]){ str +='<SPAN STYLE="font-family:webdings;position:absolute;top:0;left:' + e.attribs["arrow-offset"] + ';width:' + (e.attribs["width"] - e.attribs["arrow-offset"]) + ';overflow:hidden;color:' + e.attribs["icon-color"] + '">4</SPAN>'; } str +='</SPAN>'; thismenu.insertAdjacentHTML("BeforeEnd",str); // insert it inside the menu element thisoption = document.all.item('_link_' + menuId + '_' + i); thisoption.menuId = menuId; // save some references and initialize some variables thisoption.onmouseover = _optionmouseover; thisoption.onmouseout = _optionmouseout; prevBottom = thisoption.style.pixelTop + (e.attribs["height"] - e.attribs["border-width"]); // where should the next one draw? if(ary[i].length > 0){ // uhoh, if there is a submenu here, better draw it! thisoption.menuChild=_menus.length; // tell this option that it has a child _create(e,ary[i]); } } thismenu.style.pixelHeight = prevBottom; // set the height on the menu element } ///////////////////// /////////////////////////////////////////// /////////////////////////////////////////// //// All the following are used on the "fly" //// as needed during the documents life //// //// var _menus = new Array(); // global array of menus var _currentMenu = null; // temporary storage of the current and current root menu elements var _rootMenu = null; var _rootKludge = null; var _zIndex = 1; ///////////////////// //// show the menu for this object function _rootmouseover(){ var e = window.event.srcElement; if(_rootMenu != null){ _menus[_rootMenu].close(); } _rootMenu = e.menuId; // store a temporary reference _rootKludge = e.menuId; var attribs = _eat_attrib(e.getAttribute("menu")); // initialize its position based on the config _menus[e.menuId].style.pixelTop = attribs["top"]; _menus[e.menuId].style.pixelLeft = attribs["left"] _menus[e.menuId].style.visibility = "visible"; _menus[e.menuId].style.zIndex = _zIndex++; } //////////////////// //////////////////// //// if the mouse leaves the main element, //// try to close the displayed menu function _rootmouseout(){ _rootKludge = null; window.setTimeout("if(_rootKludge != " + _rootMenu + "){_menus[" + _rootMenu + "].close();}",_menus[_rootMenu].waitDelay); } //////////////////// //////////////////// //// nifty little IMPORTANT recursive function that //// returns true only if the id to check //// is in the heritage of the current menu! function _heritage(menu,check){ if(_menus[menu].menuId == check){ return true; }else{ // if I have a parent, check it, otherwise the answer is no if(_menus[menu].menuParent != null){ return _heritage(_menus[menu].menuParent,check); }else{ return false; } } } /////////////////// /////////////////// //// associated with every menu element object, //// close this menu unless it is still active function _close(){ if(_currentMenu != null){ if(_heritage(_currentMenu,this.menuId)){ return; } } if(this.menuChild != null){ _menus[this.menuChild].close(); } this.style.visibility = "hidden"; this.menuChild = null; this.menuParent = null; } ////////////////// ////////////////// //// when the mouse passes over an option function _optionmouseover(){ // some ugly kludges to reduce flashing when the mouse passes through a subelement of the option if(window.event.srcElement.menuId==null && window.event.fromElement.id == window.event.srcElement.offsetParent.id){ return; } if(window.event.fromElement.offsetParent!=null){ if(window.event.fromElement.menuId==null && window.event.srcElement.id == window.event.fromElement.offsetParent.id){ return; } } if(window.event.srcElement.menuId==null){ var e = window.event.srcElement.offsetParent; }else{ var e = window.event.srcElement; } e.style.background = _menus[e.menuId].highlightBG; // highlight it _currentMenu = e.menuId; // reset the current menu if(_menus[_currentMenu].menuChild != null){ // close any previous children _menus[_menus[_currentMenu].menuChild].close(); } if(e.menuChild!=null){ // if this option has a submenu, display it _menus[_currentMenu].menuChild = e.menuChild; // tell the menu it has a child _menus[e.menuChild].menuParent = _currentMenu; // tell the child it has a parent _menus[e.menuChild].style.pixelTop = _menus[_currentMenu].style.pixelTop + e.style.pixelTop + _menus[_currentMenu].menuTopoffset; _menus[e.menuChild].style.pixelLeft = _menus[_currentMenu].style.pixelLeft + _menus[_currentMenu].style.pixelWidth + _menus[_currentMenu].menuOffset; _menus[e.menuChild].style.visibility = "visible"; _menus[e.menuChild].style.zIndex = _zIndex++; } } ///////////////// ///////////////// //// when the mouse leaves the option function _optionmouseout(){ // some ugly kludges to reduce flashing when the mouse passes through a subelement of the option if(window.event.srcElement.menuId==null && window.event.toElement.id == window.event.srcElement.offsetParent.id){ return; } if(window.event.toElement.offsetParent!=null){ if(window.event.toElement.menuId==null && window.event.srcElement.id == window.event.toElement.offsetParent.id){ return; } } if(window.event.srcElement.menuId==null){ var e = window.event.srcElement.offsetParent; }else{ var e = window.event.srcElement; } e.style.background = _menus[e.menuId].normalBG; // unhighlight it var to = window.event.toElement.menuId; // greener pasture? if(to!=null){ // leaving to a menu element if(to!=e.menuId){ // not this menu _menus[_currentMenu].close(); }else{ // this menu, but hide any existing children if(_menus[e.menuId].menuChild!=null){ _menus[_menus[e.menuId].menuChild].close(); } } }else{ // wait a bit, and close the whole menu window.setTimeout("_menus[_rootMenu].close()",_menus[_rootMenu].waitDelay); } _currentMenu = null; } function _eat_attrib(str){ var chunks = new Array(); var all = new Array(); chunks=str.split(";"); for(var i=0;i<chunks.length;i++){ var tmpA = new Array(); tmpA=chunks[i].split(":"); all[tmpA[0]]=tmpA[1]; } return all; } function _strip(str){ var A = new Array(); A = str.split("\t"); str = A.join(""); A = str.split("\n"); str = A.join(""); A = str.split("\r"); str = A.join(""); return str; } ////////////////// </SCRIPT> <a href="default.htm" menu="top:60;left:200;src:menusrc;">菜单</a> <div id="menusrc" style="display:none;"> 脚本收藏夹!http://www.mb5u.com!收藏各类网站制作脚本、代码。; 素材中心!http://sc.mb5u.com!提供各类图片、表情、字体、模板、音效、矢量下载。; [ 图片下载!http://sc.mb5u.com/html/Pictures/Pictures.html!高清晰高质量图片下载; 模板下载!http://sc.mb5u.com/html/WebTemplets/index.html!各类程序、婚纱、可爱、网页模板下载; ] Chinaz!http://www.mb5u.com!Chinaz首页; </div>
所属频道:
文本链接特效
/
更新时间:2012-10-30
[收藏]
[报错]
[返回列表]
评论加载中....
相关
文本链接特效
:
后退无效的链接
一种隐藏URL的方法 (并是弹出无边窗口)
随机动态的链接Title提示
表单多选框中列出全部链接点击跳转
一个链接打开两个链接地址(新开窗口和当前窗口)
鼠标onmouse链接时复选框的状态变为checked
多个div层显示隐藏及切换
引用文章链接代码
信息框显示链接
点击链接后跳出一个链接说明小窗口
比较实用的CSS控制连接颜色效果
超链接或按钮的跳马灯式说明文字
文本链接特效Rss订阅
特效代码搜索
文本链接特效推荐
洒脱飘动的文字
JS让文字反向显示
一个逼真的JS打字效果
雾化链接
网页文本自适应宽度滚动
绝对好看仿FLASH链接文字渐变
随机信息显示
CSS 将链接的小手换成光标
总在右上角旋转显示的字符
JavaScript点击链接滑出下拉列表
猜你也喜欢看这些
简洁漂亮的CSS警告框,一般显示在网页上部
CSS让文字半透明显示在图片上
登录切换的选项卡
控制表格内的滚动条
全兼容网页固定漂浮的CSS写法
Ajax弹出漂亮可拖动的提示层(窗)效果
某一选项不被激活的滑动门(实用)代码
表格嵌套的一个实现方法
CSS滑动门及选项卡,布局在同一页面
CSS中first-letter伪类的用法
相关链接:
复制本页链接
|
搜索链接就像开始菜单一样可分几层
特效说明:
文本链接模板
-
链接就像开始菜单一样可分几层
。
闁衡偓閹増顥�&闁告帒妫旈棅锟�
QQ缂佸本妞藉Λ锟�
闁哄倻澧楀顔碱嚗椤旂厧瑙�
闁煎灚宕橀鍡楊嚗椤旂厧瑙�
濞存粏妗ㄥЧ澶岀磾閿燂拷
鐎殿喒鍋撻煫鍥у暟缂嶏拷
闁谎勫劤鐎规娊骞栧⿰鍡橆棏
濠㈣泛绉撮崺妤冪磾閹存繃绲�
闁哄洦娼欓ˇ锟�...