新微赢技术网

标题: 请教一个问题，鼠标放到大类上，在大类下方显示小类 [打印本页]

---

作者: →大虾米々    时间: 2010-1-10 03:54
标题: 请教一个问题，鼠标放到大类上，在大类下方显示小类
我想完成一个这样的功能，当鼠标放在大类上的时候，大类下方小时小类

如何完成这个效果呢...

---

作者: 魔舞飞扬    时间: 2010-1-10 03:54
程序代码：
<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>

---

作者: 青松    时间: 2010-1-10 03:54
程序代码：
<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>

---

作者: �帯銗圬肌銧�    时间: 2010-1-10 03:54
<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>



我按照你的方法改了一下不行呀

---

欢迎光临 新微赢技术网 (http://bbs.weiying.cn/)

Powered by Discuz! X3.2