225、点击式下拉菜单

225、点击式下拉菜单

以下代码加入<head>区域

<script language="JavaScript1.2">

 

//菜单1的内容

 

var menu1=new Array()

 

menu1[0]='<a href=http://www.7stk.com/>网易</a><br>'

 

menu1[1]='<a href=../../../../www.sina.com.cn>新浪网</a><br>'

 

menu1[2]='<a href=../../../../www.cctv.com>中央电视台</a><br>'

 

//菜单2的内容

 

var menu2=new Array()

 

menu2[0]='<a href=../../../11>本站论坛</a><br>'

 

menu2[1]='<a href=../../../11>本站聊天室</a><br>'

 

menu2[2]='<a href=mailto:kingage@21cn.com>来信联络</a><br>'

 

</script>

 

 

 

<style>

 

<!--

 

.iewrap1{

 

position:relative;

 

height:30px;

 

; font-family: "宋体"; font-size: 9pt}

 

.iewrap2{

 

position:absolute;

 

; font-family: "宋体"; font-size: 9pt}

 

#dropmenu0, #dropmenu1{

 

visibility:hide;

 

z-index:100;

 

}

 

#dropmenu0 { font-family: "宋体" ; font-size: 9pt}#dropmenu1 { font-family: "宋体" ; font-size: 9pt}-->

 

</style>

以下代码加入<body>区域

<script language="JavaScript1.2">

 

//以下不要改

 

var zindex=100

 

function dropit2(whichone){

 

if (window.themenu&&themenu.id!=whichone.id)

 

themenu.style.visibility="hidden"

 

themenu=whichone

 

if (document.all){

 

themenu.style.left=document.body.scrollLeft+event.clientX-event.offsetX

 

themenu.style.top=document.body.scrollTop+event.clientY-event.offsetY+18

 

if (themenu.style.visibility=="hidden"){

 

themenu.style.visibility="visible"

 

themenu.style.zIndex=zindex++

 

}

 

else{

 

hidemenu()

 

}

 

}

 

}

 

 

 

function dropit(e,whichone){

 

if (window.themenu&&themenu.id!=eval(whichone).id)

 

themenu.visibility="hide"

 

themenu=eval(whichone)

 

if (themenu.visibility=="hide")

 

themenu.visibility="show"

 

else

 

themenu.visibility="hide"

 

themenu.zIndex++

 

themenu.left=e.pageX-e.layerX

 

themenu.top=e.pageY-e.layerY+19

 

return false

 

}

 

 

 

function hidemenu(whichone){

 

if (window.themenu)

 

themenu.style.visibility="hidden"

 

}

 

 

 

function hidemenu2(){

 

themenu.visibility="hide"

 

}

 

 

 

if (document.all)

 

document.body.onclick=hidemenu

 

 

 

//以上不要改

 

</script>

 

 

 

<!----------菜单1开始---------->

 

 

 

<ilayer height=35px>

 

<layer visibility=show>

 

<span class=iewrap1>

 

<span class=iewrap2 onClick="dropit2(dropmenu0);event.cancelBubble=true;return false"><font face=宋体><a href="#" onClick="if(document.layers) return dropit(event, 'document.dropmenu0')">站点列表</a></font>

 

</span>

 

</span>

 

</layer>

 

</ilayer><br>

 

<!----------菜单1结束---------->

 

 

 

<!----------菜单2开始---------->

 

 

 

<ilayer height=35px>

 

<layer visibility=show>

 

<span class=iewrap1>

 

<span class=iewrap2 onClick="dropit2(dropmenu1);event.cancelBubble=true;return false"><font face=宋体><a href="#" onClick="if(document.layers) return dropit(event, 'document.dropmenu1')">联络方式</a></font>

 

</span>

 

</span>

 

</layer>

 

</ilayer><br>

 

<!----------菜单2结束---------->

 

 

 

<div id=dropmenu0 style="position:absolute;left:0;top:0;layer-background-color:#CDECF5;background-color:#CDECF5;width:80;visibility:hidden;border:1px solid black;padding:0px">

 

<script language="JavaScript1.2">

 

if (document.all)

 

dropmenu0.style.padding="4px"

 

for (i=0;i<menu1.length;i++)

 

document.write(menu1[i])

 

</script>

 

</div>

 

<script language="JavaScript1.2">

 

if (document.layers){

 

document.dropmenu0.captureEvents(Event.CLICK)

 

document.dropmenu0.onclick=hidemenu2

 

}

 

</script>

 

 

 

<div id=dropmenu1 style="position:absolute;left:0;top:0;layer-background-color:#CDECF5;background-color:#CDECF5;width:80;visibility:hidden;border:1px solid black;padding:0px">

 

<script language="JavaScript1.2">

 

if (document.all)

 

dropmenu1.style.padding="4px"

 

for (i=0;i<menu2.length;i++)

 

document.write(menu2[i])

 

</script>

 

</div>

 

<script language="JavaScript1.2">

 

if (document.layers){

 

document.dropmenu1.captureEvents(Event.CLICK)

 

document.dropmenu1.onclick=hidemenu2

 

}

 

</script>

 

 

Write a comment

Comments: 0