高分求弹出菜单教程,要求源码结构清晰,效果较好.想要多少分,都可以给你加上....

到这里去找找.有很多实例的,肯定有你满意的.
http://www.dhtmlcentral.com/projects/coolmenus/?m=31

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

http://www.hongen.com/pc/homepage/javascript/sample/menudraw.htm
到这里看看吧
http://www.csdn.net/expert/topic/497/497883.xml?temp=.5986597
http://www.csdn.net/expert/topic/498/498028.xml?temp=7.082766E-02
http://www.csdn.net/expert/topic/498/498049.xml?temp=.8750879
http://www.csdn.net/expert/topic/497/497869.xml?temp=.6103784http://www.csdn.net/Expert/forum.asp?typenum=8&searchKeys=%BE%AD%B5%E4%BC%AF&roomid=27&author=&tabletype=now
试试这个menu吧
<html>
<head><title>foolpot2001菜单</title>
<style>
body,td,a {font-size:9pt;color:black}
.none{border:black 1px solid;background:D9D9D9;padding-top:2}
.over {border:black 1px solid;background:707888;color:white;padding-top:2}
</style>
</head>
<body>
<div style="LEFT: 100px; CURSOR: hand; POSITION: absolute; TOP: 100px" ID="plane" onmouseup="down=false" onmousedown=down=true;divleft=event.clientX-parseInt(plane.style.left);divtop=event.clientY-parseInt(plane.style.top)>
<div align=center style="BORDER-TOP-WIDTH: 2px; BORDER-RIGHT: crimson 2px inset; Z-INDEX: 1; BACKGROUND: #707888; LEFT: 149px; BORDER-BOTTOM-WIDTH: 2px; BORDER-LEFT: crimson 2px outset; WIDTH: 100px; CURSOR: move; COLOR: white; POSITION: absolute; TOP: 34px; HEIGHT: 19px" class="none" onmouseover="menuin();init()" onmouseout="menuout()">可拖动的菜单</div>
<div align=center id="item1" style="Z-INDEX: 2; FILTER: alpha(opacity   =0);
LEFT: 250px;
WIDTH: 99px; POSITION: absolute; TOP: 55px; HEIGHT: 19px" onmouseover="this.className='over';menuin()" onmouseout="this.className='none';menuout()" class="none">菜单项一</div>
<div align=center id="item2" style="Z-INDEX: 3; FILTER: alpha(opacity  =0);
LEFT:
270px; WIDTH: 99px; POSITION: absolute; TOP: 77px; HEIGHT: 19px" class=none onmouseover="this.className='over';menuin()" onmouseout="this.className='none';menuout()"><a href="a.html"> 菜单项二</a></div>
<div align=center id="item3" style="Z-INDEX: 4; FILTER: alpha(opacity   =0);
LEFT:
290px; WIDTH: 99px; POSITION: absolute; TOP: 99px; HEIGHT: 19px" class=none onmouseover="this.className='over';menuin()" onmouseout="this.className='none';menuout()">菜单项三</div>
<div align=center id="item4" style="Z-INDEX: 5; FILTER: alpha(opacity  =0);
LEFT:
310px; WIDTH: 99px; POSITION: absolute; TOP: 121px; HEIGHT: 19px" class=none onmouseover="this.className='over';menuin()" onmouseout="this.className='none';menuout()">菜单项四</div>
<div align=center id="item5" style="Z-INDEX: 6; FILTER: alpha(opacity   =0);
LEFT: 330px;
WIDTH: 99px; POSITION: absolute; TOP: 143px; HEIGHT: 19px" class=none onmouseover="this.className='over';menuin()" onmouseout="this.className='none';menuout()">菜单项五</div></div>
<script language="vbs">
dim down,divleft,divtop,timelinestart,timelinestop,tidone,tidtwo,tidtree
down=false
timelinestart=0
timelinestop=0
sub document_onmousemove
if down then
plane.style.left=window.event.clientx-divleft
plane.style.top=window.event.clienty-divtopend if
lt.value=divleft
tp.value=divtop
tx.value=window.event.clientx
ty.value=window.event.clienty
end sub
sub document_ondargstart
window.event.returnvalue=false
end sub
function menuin()
cleartimeout(tidtree)
end function
function menuout()
tidtree=settimeout("outit()",200)
end function
function init()
if timelinestart<>5 then
cleartimeout(tidtwo)
item1.style.pixelLeft=item1.style.pixelLeft-20
item1.filters.alpha.opacity=item1.filters.alpha.opacity+20
item2.style.pixelLeft=item2.style.pixelLeft-20-4
item2.filters.alpha.opacity=item2.filters.alpha.opacity+20
item3.style.pixelLeft=item3.style.pixelLeft-20-8
item3.filters.alpha.opacity=item3.filters.alpha.opacity+20
item4.style.pixelLeft=item4.style.pixelLeft-20-12
item4.filters.alpha.opacity=item4.filters.alpha.opacity+20
item5.style.pixelLeft=item5.style.pixelLeft-20-16
item5.filters.alpha.opacity=item5.filters.alpha.opacity+20
timelinestart=timelinestart+1
else
cleartimeout(tidone)
end if
tidone=settimeout("init()",5)
end function
function outit()
if timelinestart<>0 then
cleartimeout(tidone)
item1.style.pixelLeft=item1.style.pixelLeft-5
item1.filters.alpha.opacity=item1.filters.alpha.opacity-20
item2.style.pixelLeft=item2.style.pixelLeft-6-4
item2.filters.alpha.opacity=item2.filters.alpha.opacity-20
item3.style.pixelLeft=item3.style.pixelLeft-9-8
item3.filters.alpha.opacity=item3.filters.alpha.opacity-20
item4.style.pixelLeft=item4.style.pixelLeft-13-12
item4.filters.alpha.opacity=item4.filters.alpha.opacity-20
item5.style.pixelLeft=item5.style.pixelLeft-15-16
item5.filters.alpha.opacity=item5.filters.alpha.opacity-20
timelinestart=timelinestart-1
else
cleartimeout(tidtwo)
item1.style.pixelLeft=250
item2.style.pixelLeft=270
item3.style.pixelLeft=290
item4.style.pixelLeft=310
item5.style.pixelLeft=330
end if
tidtwo=settimeout("outit()",1)
end function
</script>
divleft:<input id=lt> divtop:<input id=tp><br>
clientx:<input id=tx> clienty:<input id=ty>
</body>
</html>
go to :
www.51javascript.net
===========a.htm文件一﹕=============打開的文件
<script  src="banner.asp" ></script>
<script  src="setmenu.js" ></script>
<script>drawBanner();</script>================banner.asp文件內容=================
<% @Language="JScript" %>
<%
Response.buffer=true;
Response.Expires=0;
%>//  图形大小： 600x80
var BannerURL;
var BannerDesc;
var BannerBGColor;var BannerNavBar=new Array();
// 文字颜色,指向颜色,背景颜色
var BannerNavBarColor=new Array("white","yellow","#0099FF");var SubjBar=new Array();
var BackGroundColor="#ffffff";
var BackGroundIMG="";
var LeftBanner='';
function setBackGroundColor(strColor) {
BackGroundColor=strColor;
}
function setBackGroundIMG(strIMG) {
BackBackGroundIMG=strIMG;
}function setBannerIMG(imgUrl,strDesc) {
BannerURL=imgUrl;
BannerDesc=strDesc;
}function setBannerBGColor(bgcolor) {
BannerBGColor=bgcolor;
}function setBannerNavBarColor(txtcolor,hovercolor,bgcolor) {
BannerNavBarColor[0]=txtcolor;
BannerNavBarColor[1]=hovercolor;
BannerNavBarColor[2]=bgground;
}
function addNav(strDesc,strURL,strTarget) {
var newNav=new addNavBar(strDesc,strURL,strTarget);
BannerNavBar[BannerNavBar.length++]=newNav;
return newNav;
}function addNavBar(strDesc,strURL,strTarget) {
this.desc=strDesc;
this.url=(strURL) ? strURL : null;
this.target=(strTarget) ? strTarget : null;
this.submenu=new Array();
return this;
}function drawBanner() {
document.write("<img src=Img/Title.jpg height=80 width=780>")
document.write("<style>" +
"body {font:12pt 新细明体;margin:0pt;background:" + BackGroundColor + " url('" + BackGroundIMG + "')}" +
"td,select,input {font:12pt 新细明体;}" +
".banbar {padding:2pt;color:#cc99cc;font:9pt;background:#ffffff;}" +
"a.banbar:link {color:#99cc99;text-decoration:underline}" +
"a.banbar:visited {color:#99cc99;text-decoration:none}" +
"a.banbar:active {color:#99cc99;text-decoration:none}" +
"a.banbar:hover {color:#cc99cc;text-decoration:underline}" +
".navbar {padding:2pt;color:"+BannerNavBarColor[0]+";font:10pt;background:" + BannerNavBarColor[2] + "}" +
"a.navbar:link {color:"+BannerNavBarColor[0]+";text-decoration:none}" +
"a.navbar:visited {color:"+BannerNavBarColor[0]+";text-decoration:none}" +
"a.navbar:active {color:"+BannerNavBarColor[0]+";text-decoration:none}" +
"a.navbar:hover {color:"+BannerNavBarColor[1]+";text-decoration:underline}" +
".subnav {color:" + BannerNavBarColor[0] + ";font:10pt;background:" + BannerNavBarColor[2] + ";visibility:hidden;position:absolute;}" +
"a.subnav_a:link {font:10pt;color:"+BannerNavBarColor[0]+";text-decoration:none}" +
"a.subnav_a:visited {color:"+BannerNavBarColor[0]+";text-decoration:none}" +
"a.subnav_a:active {color:"+BannerNavBarColor[0]+";text-decoration:none}" +
"a.subnav_a:hover {color:"+BannerNavBarColor[1]+";text-decoration:underline}" +
"</style>"); tmp="<table border=0 cellpadding=4 cellspacing=0 width=100%><tr><td nowrap class=navbar>";
    for (i=0;i<BannerNavBar.length;i++) {
    if (BannerNavBar[i].url) {
    tmp+="<a class=navbar href=" + BannerNavBar[i].url;
    if (BannerNavBar[i].target) tmp+=" target=" + BannerNavBar[i].traget;
    if (BannerNavBar[i].submenu.length>0)
    tmp+=" onmouseover=showBaner(subnav" + i + ") onmouseout=hideBaner(subnav" + i + ")";
    tmp+=">";
    }
    tmp+=BannerNavBar[i].desc;
    if (BannerNavBar[i].url) tmp+="</a>";
    tmp+=" | ";
    }
    tmp+="</td></tr></table>";
    document.write(tmp);     for (i=0;i<BannerNavBar.length;i++) {
   if (BannerNavBar[i].submenu.length>0) {
    tmp="<table border=0 cellpadding=5 cellspacing=0 class=subnav id=subnav" + i + " onmouseover=showBaner(subnav" + i + ") onmouseout=hideBaner(subnav"+i+")>";
    for (var j=0;j<BannerNavBar[i].submenu.length;j++) {
    var m=BannerNavBar[i].submenu[j]
    tmp+="<tr><td nowrap>"
    if (m.url) {
    tmp+="<a class=subnav_a href='" + m.url + "'";
    if (m.target) tmp+=" target=" + m.target;
    tmp+=">";
    }
    tmp+=m.desc;
    if (m.url) tmp+="</a>";
    tmp+="</td></tr>";
    }
    tmp+="</table>";
    document.write(tmp);
    }
    }
    resizeBanner();
}function fadeIn(o) {
o.style.filter="blendTrans(duration=2)";
if (o.filters.blendTrans.status != 2) {
o.filters.blendTrans.apply();
o.style.visibility="visible";
o.filters.blendTrans.play();
}
}function addSubj(strDesc,strURL,strTarget) {
SubjBar[SubjBar.length++]=new addSubjBar(strDesc,strURL,strTarget);
}function addSubjBar(strDesc,strURL,strTarget) {
this.desc=strDesc;
this.url=(strURL) ? strURL : null;
this.target=(strTarget) ? strTarget : null;
return this;
}function drawSubj() {
var tmp="<table border=0 cellpadding=3 cellspacing=0>";
for (var i=0;i<SubjBar.length;i++) {
tmp+="<tr><td>"
if (SubjBar[i].url) {
tmp+="<a href=" + SubjBar[i].url;
if (SubjBar[i].target) tmp+=" target=" + SubjBar[i].target;
tmp+=">";
}
tmp+=SubjBar[i].desc
if (SubjBar[i].url) tmp+="</a>";
tmp+="</td></tr>";
}
tmp+="</table>";
document.write(tmp);
}function addSubNav(oparnent,sdesc,surl,starget) {
oparnent.submenu[oparnent.submenu.length++]=new addSubNavBar(sdesc,surl,starget);
}function addSubNavBar(sdesc,surl,starget) {
this.desc=sdesc;
this.url=(surl) ? surl : null;
this.target=(starget) ? starget : null;
return this;
}
var tim,otim,posY1,posY2,menuSpeed=3;function hideBaner(s) {
s.style.visibility="hidden";
}function scrollMenu() {
if (posY1<posY2) {
posY1+=3;
otim.left=posY1;
tim=setTimeout("scrollMenu()",menuSpeed)
}
else {
clearTimeout(tim);
}
}function showBaner(s) {
var e=window.event.srcElement;
if (e.className=="navbar") {
s.style.left=e.offsetLeft;
s.style.width=e.offsetWidth;
s.style.pixelTop=e.style.pixelTop+97;
}
s.style.visibility="visible";
}===============setmenu.js內容﹕===============設置菜單項
var a=addNav(" 首页 ","/");
a=addNav(" 菜单一 ","/Topest.asp");
addSubNav(a,"子菜单一","/hjpp","_self");
    addSubNav(a," 子菜单二","/call","_self");
    addSubNav(a," 子菜单三"," /work/","_self");
a=addNav("  菜单一 ","/compter.asp");
addSubNav(a,"ABCD","/jobplan","_self");
addSubNav(a,"XYZ "," /price/manage_show.asp?abc=公告","_self");