JS实现鼠标滑过显示边框的菜单效果
本文实例讲述了JS实现鼠标滑过显示边框的菜单效果。分享给大家供大家参考，具体如下：
<html>
<head>
<title>JS鼠标滑过显示边框菜单</title>
</head>
<body>
<style>
.menulines{
border:1pxsolidwhite;
}
.menulinesa{
text-decoration:none;
color:red;
}
</style>
<scriptlanguage="JavaScript1.2">
functionborderize(what,color){
what.style.borderColor=color
}
functionborderize_on(e){
if(document.all)
source3=event.srcElement
elseif(document.getElementById)
source3=e.target
if(source3.className=="menulines"){
borderize(source3,"black")
}
else{
while(source3.tagName!="TABLE"){
source3=document.getElementById?source3.parentNode:source3.parentElement
if(source3.className=="menulines")
borderize(source3,"black")
}
}
}
functionborderize_off(e){
if(document.all)
source4=event.srcElement
elseif(document.getElementById)
source4=e.target
if(source4.className=="menulines")
borderize(source4,"white")
else{
while(source4.tagName!="TABLE"){
source4=document.getElementById?source4.parentNode:source4.parentElement
if(source4.className=="menulines")
borderize(source4,"white")
}
}
}
</script>
<tableborder="0"width="150"cellspacing="0"cellpadding="0"onMouseover="borderize_on(event)"onMouseout="borderize_off(event)"height="95">
<tr><tdwidth="100%"bgcolor="#E6E6E6"height="13"><b><fontsize="2">导航菜单</font></b></td></tr>
<tr><tdwidth="100%"class="menulines"height="14"><ahref="#">网页特效</a></td></tr>
<tr><tdwidth="100%"class="menulines"height="14"><ahref="#">学习教程</a></td></tr>
<tr><tdwidth="100%"class="menulines"height="14"><ahref="#">网页素材</a></td></tr>
<tr><tdwidth="100%"class="menulines"height="14"><ahref="#">软件下载</a></td></tr>
<tr><tdwidth="100%"class="menulines"height="14"><ahref="#">平面设计</a></td></tr>
</table>
</body>
</html>
更多关于JavaScript相关内容感兴趣的读者可查看本站专题：《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript动画特效与技巧汇总》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》
希望本文所述对大家JavaScript程序设计有所帮助。