当鼠标滑过时，产生的下拉菜单

最新推荐文章于 2023-06-29 08:45:24 发布

qq513283439

最新推荐文章于 2023-06-29 08:45:24 发布

阅读量836

点赞数

分类专栏： web

web 专栏收录该内容

38 篇文章 0 订阅

订阅专栏

原文件出处： http://www.30a.net/index-htm-LangType-cn-BasePage-1208-article_id-16535.htm

<html>
<title>网页顶部导航菜单，鼠标滑过弹出下拉菜单丨</title>
<body>
<SCRIPT type=text/jscript>
var eMenu,eItem,eExit,eDesk;
function doMenu(){
eMenu.style.backgroundColor=eDesk.bgcolor;
if ((eItem.offsetLeft+eMenu.offsetWidth-4)<eDesk.offsetWidth) eMenu.style.posLeft=eItem.offsetLeft;
else eMenu.style.posLeft=eDesk.offsetWidth-eMenu.offsetWidth;
eMenu.style.posTop=eDesk.offsetHeight+eDesk.offsetTop;
eMenu.style.visibility='visible';
}
function noMenu(){
if (eMenu && eMenu!=null) {eMenu.style.visibility='hidden';
eMenu.style.posLeft=0;eMenu.style.posTop=0;}
eMenu=eItem=eExit=eDesk=null;
}
function doOver(){
if ("A"==event.srcElement.tagName.toUpperCase()) {
eItem=event.srcElement.parentElement;
eDesk=eItem.parentElement;
eMenu=document.all(eItem.id.replace('item','menu'));
if (eMenu && eMenu!=null) {eMenu.οnmοuseοut=doExit;doMenu();}
else noMenu();}
}
function doExit(){
eExit=event.toElement;
if (eMenu==null || eExit==null) return;
if (!eMenu.contains(eExit) && !eItem.contains(eExit)) noMenu();
}

</SCRIPT>
<STYLE type=text/css>

.menu {

VISIBILITY: hidden;
POSITION: absolute
}

.desk SPAN {
HEIGHT: 17px;

}
.desk {
COLOR: #ffffff; LETTER-SPACING: 1px
}

.menu A {
COLOR: #ffffff
}

.menu A:hover {
COLOR: #ffcc00
}

</STYLE>

<DIV class="menu" id="menu14">
<li><a href="/html/txdm/wybj/" title="">网页背景特效</a></li>
<li><a href="/html/txdm/rqsj/" title="">日期时间特效</a></li>
<li><a href="/html/txdm/ymss/" title="">页面搜索特效</a></li>
<li><a href="/html/txdm/bgtx/" title="">表格表单特效</a></li>
<li><a href="/html/txdm/qtdm/" title="">其他网页特效</a></li>
</DIV>
<DIV class="menu" id="menu15">
<li><a href="/list/2_1.html" title="">淘客源码下载</a></li>
<li><a href="/list/58_1.html" title="">CMS系统源码</a></li>
<li><a href="/list/3_1.html" title="">seo工具软件</a></li>
</DIV>