| 网站首页 | 业界新闻 | 小组 | 威客 | 人才 | 下载频道 | 博客 | 代码贴 | 在线编程 | 编程论坛
欢迎加入我们,一同切磋技术
用户名:   
 
密 码:  
共有 617 人关注过本帖
标题:请教一个问题,鼠标放到大类上,在大类下方显示小类
只看楼主 加入收藏
zhuzhanjun
Rank: 1
等 级:新手上路
帖 子:146
专家分:0
注 册:2008-5-3
结帖率:100%
收藏
 问题点数:0 回复次数:3 
请教一个问题,鼠标放到大类上,在大类下方显示小类
我想完成一个这样的功能,当鼠标放在大类上的时候,大类下方小时小类

如何完成这个效果呢...
搜索更多相关主题的帖子: 鼠标 效果 
2008-06-07 11:13
hmhz
Rank: 7Rank: 7Rank: 7
等 级:贵宾
威 望:30
帖 子:1890
专家分:503
注 册:2006-12-17
收藏
得分:0 
程序代码:
<style>
#1_1 {padding:5px 0 5px 0; width:800px; height:39px; border:1px solid #808080; overflow:hidden;}
#1_1 a {float:left; display:block; margin-left:5px; width:100px; line-height:25px; border:1px solid #808080; text-align:center; text-decoration:none;}
#1_1 a:hover {color:red;}

#2_1,#2_2,#2_3,#2_4,#2_5,#2_6,#2_7 {padding:5px 0 5px 0; width:800px; line-height:39px; border-left:1px solid #808080; border-bottom:1px solid #808080; border-right:1px solid #808080; text-align:center; overflow:hidden;}
</style>
<script type="text/javascript">
function g(o) {return document.getElementById(o);} 
function Li(n) {for(var i=1;i<8;i++){if(n==i){g("2_"+i).style.display="block";}else{g("2_"+i).style.display="none";}}}
</script>

<div id="1_1">
<a href="#" onmouseover="Li(1);">大类①</a>
<a href="#" onmouseover="Li(2);">大类②</a>
<a href="#" onmouseover="Li(3);">大类③</a>
<a href="#" onmouseover="Li(4);">大类④</a>
<a href="#" onmouseover="Li(5);">大类⑤</a>
<a href="#" onmouseover="Li(6);">大类⑥</a>
<a href="#" onmouseover="Li(7);">大类⑦</a>
</div>

<div id="2_1" style="display:none;">①小类① | ①小类② | ①小类③ | ①小类④ | ①小类⑤ | ①小类⑥ | ①小类⑦</div>
<div id="2_2" style="display:none;">②小类① | ②小类② | ②小类③ | ②小类④ | ②小类⑤ | ②小类⑥ | ②小类⑦</div>
<div id="2_3" style="display:none;">③小类① | ③小类② | ③小类③ | ③小类④ | ③小类⑤ | ③小类⑥ | ③小类⑦</div>
<div id="2_4" style="display:none;">④小类① | ④小类② | ④小类③ | ④小类④ | ④小类⑤ | ④小类⑥ | ④小类⑦</div>
<div id="2_5" style="display:none;">⑤小类① | ⑤小类② | ⑤小类③ | ⑤小类④ | ⑤小类⑤ | ⑤小类⑥ | ⑤小类⑦</div>
<div id="2_6" style="display:none;">⑥小类① | ⑥小类② | ⑥小类③ | ⑥小类④ | ⑥小类⑤ | ⑥小类⑥ | ⑥小类⑦</div>
<div id="2_7" style="display:none;">⑦小类① | ⑦小类② | ⑦小类③ | ⑦小类④ | ⑦小类⑤ | ⑦小类⑥ | ⑦小类⑦</div>

[编程论坛] ASP超级群:49158383  敲门暗号:ASP编程
龍艺博客 http://www.
2008-06-07 15:35
zhuzhanjun
Rank: 1
等 级:新手上路
帖 子:146
专家分:0
注 册:2008-5-3
收藏
得分:0 
<script type="text/javascript">
function g(o) {return document.getElementById(o);}
function Li(n) {for(var i=1;i<2;i++){if(n==i){g("2_"+i).style.display="block";}else{g("2_"+i).style.display="none";}}}
</script>
                   <%
              dim sql,rs
            sql="select * from content where user='zhuzhu' and BigClassName='心情日志'"
            set rs=server.CreateObject("adodb.recordset")
            rs.open sql,conn,1,1
          %>
          <TD class=blog align=middle>
          <div id="1_1">
          <a href="#" onmouseover="Li(1);">心情日志</a>
          </div>
          </TD>
          <div id="2_1" style="display:none;">
              <%
                if not rs.eof then
                do while not rs.eof
            %>
                <%=rs("SmallClassName")%>|
            <%
                rs.movenext
                loop
                end if%>
          </div>



我按照你的方法改了一下不行呀
2008-06-07 17:46
hmhz
Rank: 7Rank: 7Rank: 7
等 级:贵宾
威 望:30
帖 子:1890
专家分:503
注 册:2006-12-17
收藏
得分:0 
程序代码:
<script type="text/javascript">
function g(o) {return document.getElementById(o);} 
function Li() {g("2_1").style.display="none"?"block":"none";}
</script>
<%
dim sql,rs
sql="select * from content where user='zhuzhu' and BigClassName='心情日志'"
set rs=server.CreateObject("adodb.recordset")
rs.open sql,conn,1,1
%>
<td class="blog" align="middle">
<div id="1_1"><a href="#" onmouseover="Li();">心情日志</a></div>
</td>
<div id="2_1" style="display:none;">
<%
if not rs.eof then
do while not rs.eof
%> <%=rs("SmallClassName")%>| <%
rs.movenext
loop
end if%>
</div>

[编程论坛] ASP超级群:49158383  敲门暗号:ASP编程
龍艺博客 http://www.
2008-06-08 11:29
快速回复:请教一个问题,鼠标放到大类上,在大类下方显示小类
数据加载中...
 
   



关于我们 | 广告合作 | 编程中国 | 清除Cookies | TOP | 手机版

编程中国 版权所有,并保留所有权利。
Powered by Discuz, Processed in 0.031001 second(s), 8 queries.
Copyright©2004-2024, BCCN.NET, All Rights Reserved