Hello cikgu, selepas saya selesai menulis, saya mengalami masalah gelongsor.
你想拥有你从未有过的东西 ,那么你必须去做你从未做过的事情。
.
warna latar belakang: # 000000;
jidar: 0 auto;
jejari sempadan: 10px;
warna: #ffffff;
jidar: 1px pepejal #ccc;
jidar atas: 20px;
saiz fon: 14
;px
}
: px0 ;
.tiga li {
lebar: 99px;
tinggi: 30px;
garis-tinggi: 30px;
;
; gt;
<script type="text/javascript" src="js/jquery-1.7.1.min.js" ></script>
<script>
$(document).ready(function() {
//隐藏二级三级菜单
$(".twobox").hide()
$(".three").hide()
//鼠标移匨姻级菜单时显示
$(".one>li").mouseover(function(){
$(this).find(".twobox").slideDown(500)
})
//造移除时隐藏
$(".one>li").mouseleave(function(){
$(this).find(".twobox").slideUp(500)
});
//当鼠标移动到包含三级菜单的二级菜单时显示
$(".two").mouseover(function(){(
) .("slaid ulang" 0).
//.find()遍历 .mouseover鼠标移动 .mouseleave鼠标移除 .slideDown()滑动方式 街
//总结 在html方面出现卡壳 浪费了很多时间 在jQuery方面比较稳定
</skrip>
</kepala>
<badan>
<div class="menu">
<ul class="one">
<li>Homepage</li>
<li>Konoha
= " <oul class ">
<li>Sarutobi Clan</li>
<li class="two">Senju Clan
<ul class="three">
< sur<< /li & gt;
& lt; li & gt; Senju hashirama & lt;/li & gt;
& lt; li & gt; senju tobirama & lt; ;/li>
<li class="two">Uchiha clan
< ;li>Indra Otsutsuki</li>
" <li>debu</li>
<li class="two">Shadow
<ul class="tiga">
<li>Generasi pertama</li>
<li> ;Penumpang A</li>
<li>Penumpang B</li>>
< ;li>Sand Ninja</li>
<li>Mist Ninja< /li>
<li>Cloud Ninja</li>
</ul>
;/body>
</html>
Saya perlukan kod sumber anda
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
.
<gaya> * { jidar: 0; pelapik: 0; } .menu { lebar:warna latar belakang: # 000000;
jidar: 0 auto;
jejari sempadan: 10px;
warna: #ffffff;
jidar: 1px pepejal #ccc;
jidar atas: 20px;
gaya senarai: tiada; } ul li { lebar: 100px; tinggi: 30px;saiz fon: 14
px;saiz fon: 14
teks- jajar: tengah; apungan: kiri; sempadan-kanan: 1px pepejal #ffffff; kursor: penunjuk; } .twobox li;px
.twobox li {;px
warna latar belakang: #ccc; warna: #000; saiz fon: 14px; garis-tinggi: 30px; kedudukan: relatif; sempadan: 0px;}
.twobox li:hover { warna: #ffffff; latar belakang-warna: #000; } .tiga { kedudukan kiri: mutlak;: px0 ;
}
.tiga li {
lebar: 99px;
tinggi: 30px;
garis-tinggi: 30px;
;
;
;
; gt;
<script type="text/javascript" src="js/jquery-1.7.1.min.js" ></script>
<script>
$(document).ready(function() {
//隐藏二级三级菜单
$(".twobox").hide()
$(".three").hide()
//鼠标移匨姻级菜单时显示
$(".one>li").mouseover(function(){
$(this).find(".twobox").slideDown(500)
})
})
})
//造移除时隐藏
$(".one>li").mouseleave(function(){
$(this).find(".twobox").slideUp(500)
});
//当鼠标移动到包含三级菜单的二级菜单时显示
$(".two").mouseover(function(){(
) .("slaid ulang" 0).
}) //当鼠标移除时隐藏 $(".two").mouseleave(function(){ $(this).find(".three").slideUp(500)})
})
//.find()遍历 .mouseover鼠标移动 .mouseleave鼠标移除 .slideDown()滑动方式 街
//总结 在html方面出现卡壳 浪费了很多时间 在jQuery方面比较稳定
</skrip>
</kepala>
<badan>
<div class="menu">
<ul class="one">
<li>Homepage</li>
<li>Konoha
= " <oul class ">
<li>Sarutobi Clan</li>
<li class="two">Senju Clan
<ul class="three">
< sur<< /li & gt;
& lt; li & gt; Senju hashirama & lt;/li & gt;
& lt; li & gt; senju tobirama & lt; ;/li>
<li class="two">Uchiha clan
<ul class="three">
< ;li>Indra Otsutsuki</li>
;Mali>;
;/li> <li>Indra Uchiha</li> <li>Uchiha Sasuke</li> <li>Iwa Ninja <oboxul" class="t" <li>debu</li>
<li class="two">Shadow
<ul class="tiga">
<li>Generasi pertama</li>
li & gt; generasi kedua & lt;/li & gt; & lt; li & gt; tiga & lt;/li & gt; & lt; li & gt; ="dua">Cair<ul class="tiga">
<li> ;Penumpang A</li>
<li>Penumpang B</li>>
C</li> <li>Penumpang D</li> < ;/ul> </li> <<< ;li>Sand Ninja</li>
<li>Mist Ninja< /li>
<li>Cloud Ninja</li>
</ul>
&<>&;/body>
</html>
Saya perlukan kod sumber anda