js制作可以延时消失的菜单

本文实例为大家分享了射流研究…可延时消失的菜单，供大家参考，具体内容如下

代码：

html health eta http-equiv=' Content-Type ' Content=' text/html；charset=utf-8' /title无标题文档/title style * { padd :0；margin :0 } ul { list-style : none；} a { text-decoration : none} #菜单{ height :200 pxborder :1 px固体# cccmargin:40px汽车；位置：相对；} # title { position : absolute eleft :0 top :0高度：50 pxborder:1px固体黄色；背景：蓝色；} #标题李{ text-align : center宽度：80 px高度：30 px线高：30 pxfloat:left背景# f1 f1 f1边框-半径：10 pxcolor: # 000font-weight :加粗；边距margin:10px 5pxcursor:pointer指针指针；} #副标题{ height:30pxborder:1px固体# cccborder-radius :10 px；位置：绝对；top:60pxleft:10px} #字幕：before在{内容： }之前；位置：绝对；边框-top:7px固体透明；右边框：7px实心透明；边框-底部：9px实心# cccborder-left:7px实心透明；top :-16px；left :30 px } # subtitle : after在{内容： }之后；位置：绝对；边框-top:7px固体透明；右边框：7px实心透明；边框-底部：9px实心# fffborder-left:7px实心透明；top :-15px；left:30px} #字幕{ display : inline-block；高度：20 px线高：20 px余量：5 px 5pxfloat 3360 left } #副标题：悬停{文本装饰3 3360下划线；}/style脚本窗口。onload=function(){ var title=document。getelementbyid(' title ')；var subtitle=文档。getelementbyid('副标题')；var aA=字幕。getelementsbytagname(' a ')；var AlI=标题。getelementsbytagname(' Li ')；var arr=[ { title : '首页，副标题： ['首页1','首页2','首页3']}，{ title : '关于我们，副标题： ['关于我们1','关于我们2','关于我们3','关于我们4','关于我们5']}，{ title : '课程，副标题： ['课程1','课程2','课程3']}，{ title : '新闻，副标题： ['新闻1','新闻2']}, ];定义变量计时器=null for(var I=0；一、长度；I){ var OLi=document。创建元素(“李”)；oLi.innerHTML=arr[i].标题；奥利。指数=I；奥利。onmouseover=function(){ var width=parsent(getStyle(this，' width '))；var margin right=parsent(getStyle(this，' margin right '))；clearTimeout(计时器);subtitle . innerhtml=create a(this。索引)；subtitle.style.left=10(宽度右边距)*这个。索引' px；副标题。风格。display=' block} OLi。onmouseout=function(){ timer=setTimeout(function(){ subtitle。风格。显示='无'；}, 100);}标题。append child(OLi)；}副标题。onmouseover=function(){ cleartime out(计时器);这个。风格。display=' block}副标题。onmouseout=function(){ this。风格。显示='无'；} CreateA(0)；函数createA(index){ for(var j=0；j arr[索引]。副标题。长度；j){ var oA=文档。创建元素(' a ')；oA.innerHTML=arr[index].副标题[j]；副标题。阑尾切除术；} }函数getStyle(ele，attr) { return ele.currentStyle？埃勒。当前样式[attr]: GetComputedstyle(ele，0)[attr]；} }/脚本/标题dydiv id=' menu ' ul id=' title '/ul div id=' subtitle '/div/div/body/html以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。