几个不错的自动收缩菜单导航效果 时间:2020-05-12 人气:0 runcode <script type="text/javascript"> var mh = 30;//最小高度 var step = 1;//每次变化的px量 var ms = 10;//每隔多久循环一次 function toggle(o){ if (!o.tid)o.tid = "_" + Math.random() * 100; if (!window.toggler)window.toggler = {}; if (!window.toggler[o.tid]){ window.toggler[o.tid]={ obj:o, maxHeight:o.offsetHeight, minHeight:mh, timer:null, action:1 }; } o.style.height = o.offsetHeight + "px"; if (window.toggler[o.tid].timer)clearTimeout(window.toggler[o.tid].timer); window.toggler[o.tid].action *= -1; window.toggler[o.tid].timer = setTimeout("anim('"+o.tid+"')",ms ); } function anim(id){ var t = window.toggler[id]; var o = window.toggler[id].obj; if (t.action < 0){ if (o.offsetHeight <= t.minHeight){ clearTimeout(t.timer); return; } } else{ if (o.offsetHeight >= t.maxHeight){ clearTimeout(t.timer); return; } } o.style.height = (parseInt(o.style.height, 10) + t.action * step) + "px"; window.toggler[id].timer = setTimeout("anim('"+id+"')",ms ); } </script> 伸缩效果 内容 内容 内容 内容 伸缩效果 sdf容 sdf容 sf容 sfd容 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]一打开网页是收缩的 runcode <script type="text/javascript"> var mh = 30;//最小高度 var step = 1;//每次变化的px量 var ms = 10;//每隔多久循环一次 var caiying2007=202//最大高度 window.onload=function init(){ var obj_init=document.getElementsByTagName("div") for (var oi=0;oi= t.maxHeight){ clearTimeout(t.timer); return; } } o.style.height = (parseInt(o.style.height, 10) + t.action * step) + "px"; window.toggler[id].timer = setTimeout("anim('"+id+"')",ms ); } </script> 伸缩效果 内容 内容 内容 内容 伸缩效果 sdf容 sdf容 sf容 sfd容 <script> </script> [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]慢慢展开菜单的效果,以前早就有人做过,给个时间函数。也算不上什么极限: <script LANGUAGE="JavaScript"> </script> Cattom <script language="JavaScript"> nereidFadeObjects = new Object(); nereidFadeTimers = new Object(); function nereidFade(object, destOp, rate, delta){ if (!document.all) return if (object != "[object]"){ //提取串值 setTimeout("nereidFade("+object+","+destOp+","+rate+","+delta+")",0); return; } clearTimeout(nereidFadeTimers[object.sourceIndex]); diff = destOp-object.filters.alpha.opacity; direction = 1; if (object.filters.alpha.opacity > destOp){ direction = -1; } delta=Math.min(direction*diff,delta); object.filters.alpha.opacity+=direction*delta; if (object.filters.alpha.opacity != destOp){ nereidFadeObjects[object.sourceIndex]=object; nereidFadeTimers[object.sourceIndex]=setTimeout("nereidFade(nereidFadeObjects["+object.sourceIndex+"],"+destOp+","+rate+","+delta+")",rate); } } </script> <script language=javascript> var whichOpen=menuTitle1; var whichContinue=""; </script> 4 ::动漫同人志:: :::日韩动漫::: :::港台动漫::: :::大陆动漫::: :::原创动漫::: :::友情链接::: 4 ::动漫音乐:: ::日韩动漫音乐:: ::港台动漫音乐:: ::大陆动漫音乐:: ::动漫音乐库:: :::网友点播::: 4 ::网页123:: ::网页基础:: ::网页进阶:: ::网页高手:: ::网页脚本:: ::网页理念:: ::网页源件:: 4 ::兄弟站点:: 征集中... 征集中... 征集中... 征集中... 征集中... 征集中... [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] tree menu by jiarry <script language="JavaScript" type="text/JavaScript"> </script> +栏目一 菜单一 菜单二 菜单三 +栏目二 菜单一 菜单二 菜单三 +栏目三 菜单一 菜单二 菜单三 +栏目四 菜单一 菜单二 菜单三 菜单三 菜单三 菜单三 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 加载全部内容