js 单击式的下拉菜单效果实例
内容导读
互联网集市收集整理的这篇技术教程文章主要介绍了js 单击式的下拉菜单效果实例，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含1830字，纯文字阅读大概需要3分钟。
内容图文
代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=gb2312" />
<title>js 单击式的下拉菜单效果</title>
<style>
.div1 { width: 120px; height: 20px; line-height:20px; text-align:center; }
.div2 {width: 120px; position:absolute; left:0; top:10px;visibility:hidden; }
.div2 a{ display:block;}
</style>
</head>
<body>
<script language="JavaScript">
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.onclick=hidemenu
</script>
<span class="div1" onClick="dropit2(dropmenu);event.cancelBubble=true;return false"> <a href="###" onClick="if(document.layers) return dropit(event, 'document.dropmenu')">[点击显示菜单]</a> </span>
<div class="div2" id="dropmenu">
<a href="//www.gxlcms.com">脚本之家</a>
<a href="#">个性名字网</a>
<a href="#">个性名字网</a>
</div>
</body>
</html> </td>
</tr>
</table>
内容总结
以上是互联网集市为您收集整理的js 单击式的下拉菜单效果实例全部内容，希望文章能够帮你解决js 单击式的下拉菜单效果实例所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。
内容备注
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。
内容手机端
扫描二维码推送至手机访问。