高分
日期：2014-05-16 浏览次数：20358 次
高分求助
我的导航栏 有 多个栏目 然后想实现 鼠标 点击或者 经过 导航栏目名称时 在下一排 自动出来 这个栏目的子栏目 请问怎么实现 谢谢大家
------解决方案--------------------
网上下拉菜单的js脚本一大把,baidu下就知道了
------解决方案--------------------
onmoveover事件时创建菜单
菜单要是简单的就是用一div层里面放上一些链接，
复杂的菜单可以到网上下载
------解决方案--------------------
<style>
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
background-image: url(images/background_003.gif);
background-repeat: repeat-x;
padding-left: 0px;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
}
table {border-collapse:separate;}
td {border:#000 solid 1px;}
</style>
<html> <head> <title> Untitled Document </title> </head> <body>
<div align=left> <table width= "410 " height=50 border=1 align= "left " cellpadding= "0 " cellspacing= "0 "> --410是每个单元格 4*100+8个td+2个border
<tr >
<td width= "100 ">
<input type=button value=ok onmouseover= "cc(this) "
onmouseout= "document.all.pop.style.display= 'none ' ">
</td>
<td width= "100 ">
<input type=button value=ok onmouseover= "cc(this) "
onmouseout= "document.all.pop.style.display= 'none ' ">
</td>
<td width= "100 " >
<input type=button value=ok onmouseover= "cc(this) "
onmouseout= "document.all.pop.style.display= 'none ' ">
<td width= "100 ">
<input type=button value=ok onmouseover= "cc(this) "
onmouseout= "document.all.pop.style.display= 'none ' ">
</td>
</tr>
</table>
<div>
<div id=pop style= "position:absolute;width:100;height:50;z-index:99;display:none ">
<table border=0 bgcolor=#FF0000> <tr> <td> 图层文字 </td> </tr> </table> </div>
<script language=javascript>
function cc(tt)
{
var daps = document.all.pop.style;
var ttop = tt.offsetTop; //TT控件的定位点高
var thei = tt.clientHeight; //TT控件本身的高
var tleft = tt.offsetLeft; //TT控件的定位点宽
var ttyp = tt.type; //TT控件的类型
while (tt = tt.offsetParent){ttop+=tt.offsetTop; tleft+=tt.offsetLeft;}
daps.top = (ttyp== "image ")? ttop+thei : ttop+thei+6; //层的 Y 坐标
daps.left = tleft + 1; //层的 X 坐标
daps.display = " "; //层显示
}
</script>
</body> </html>
我的导航栏 有 多个栏目 然后想实现 鼠标 点击或者 经过 导航栏目名称时 在下一排 自动出来 这个栏目的子栏目 请问怎么实现 谢谢大家
------解决方案--------------------
网上下拉菜单的js脚本一大把,baidu下就知道了
------解决方案--------------------
onmoveover事件时创建菜单
菜单要是简单的就是用一div层里面放上一些链接，
复杂的菜单可以到网上下载
------解决方案--------------------
<style>
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
background-image: url(images/background_003.gif);
background-repeat: repeat-x;
padding-left: 0px;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
}
table {border-collapse:separate;}
td {border:#000 solid 1px;}
</style>
<html> <head> <title> Untitled Document </title> </head> <body>
<div align=left> <table width= "410 " height=50 border=1 align= "left " cellpadding= "0 " cellspacing= "0 "> --410是每个单元格 4*100+8个td+2个border
<tr >
<td width= "100 ">
<input type=button value=ok onmouseover= "cc(this) "
onmouseout= "document.all.pop.style.display= 'none ' ">
</td>
<td width= "100 ">
<input type=button value=ok onmouseover= "cc(this) "
onmouseout= "document.all.pop.style.display= 'none ' ">
</td>
<td width= "100 " >
<input type=button value=ok onmouseover= "cc(this) "
onmouseout= "document.all.pop.style.display= 'none ' ">
<td width= "100 ">
<input type=button value=ok onmouseover= "cc(this) "
onmouseout= "document.all.pop.style.display= 'none ' ">
</td>
</tr>
</table>
<div>
<div id=pop style= "position:absolute;width:100;height:50;z-index:99;display:none ">
<table border=0 bgcolor=#FF0000> <tr> <td> 图层文字 </td> </tr> </table> </div>
<script language=javascript>
function cc(tt)
{
var daps = document.all.pop.style;
var ttop = tt.offsetTop; //TT控件的定位点高
var thei = tt.clientHeight; //TT控件本身的高
var tleft = tt.offsetLeft; //TT控件的定位点宽
var ttyp = tt.type; //TT控件的类型
while (tt = tt.offsetParent){ttop+=tt.offsetTop; tleft+=tt.offsetLeft;}
daps.top = (ttyp== "image ")? ttop+thei : ttop+thei+6; //层的 Y 坐标
daps.left = tleft + 1; //层的 X 坐标
daps.display = " "; //层显示
}
</script>
</body> </html>
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
