<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title></title>
</head>
<style type="text/css">
.top-nav {
font-size: 14px;
font-weight: bold;
list-style: none;
}
.top-nav li {
float: left;
margin-left: 1px;
}
.top-nav li a {
line-height: 34px;
text-decoration: none;
background: #3f240e;
color: #fff;
display: block;
width: 80px;
text-align: center;
}
.top-nav ul {
list-style: none;
display: none;
padding: 0;
position: absolute;
height: 0;
overflow: hidden;
}
.top-nav li a:hover {
background: url(images/slide-bg.png) 0 0 repeat-x;
}
.note {
color: #3f240e;
display: block;
background: url(images/slide-bg.png) 0 0 repeat-x;
}
.corner {
display: block;
height: 11px;
background: url(images/corner.png) 31px 0 no-repeat;
}
</style>
<script type="text/javascript">
window.onload = function() {
var Lis = document.getElementsByTagName("li");
var timer=null;
for(var i=0; i<Lis.length; i++) {
Lis[i].onmouseover = function() {
var u = this.getElementsByTagName("ul")[0];
if(u != undefined) {
u.style.display = "block";
clearInterval(timer);
timer=setInterval(AddH,10);
}
}
Lis[i].onmouseout = function() {
var u = this.getElementsByTagName("ul")[0];
if(u != undefined) {
clearInterval(timer);
timer=setInterval(SubH,100);
}
}
}
}
function AddH() {
var ulList = document.getElementById("mnuUL");
var h = ulList.offsetHeight;
h += 1;
if(h>42) {
return;
}
else {
ulList.style.height = h + "px";
}
}
function SubH() {
var ulList = document.getElementById("mnuUL");
var h = ulList.offsetHeight;
h -= 1;
if(h <=0) {
ulList.style.height =0;
}
else {
ulList.style.display =h + "px";
}
}
</script>
<body>
<ul class="top-nav">
<li><a href="#"><span class="note">慕课网</span></a></li>
<li><a href="#">课堂大厅</a></li>
<li><a href="#">学习中心</a>
<ul id="mnuUL">
<span class="corner"></span>
<li><a href="#">前端课程</a></li>
<li><a href="#">手机开发</a></li>
<li><a href="#">后台编程</a></li>
</ul>
</li>
<li><a href="#">关于我们</a></li>
</ul>
</body>
</html>
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Jika perlu dihapuskan, maka
Anda menyiarkan sekeping kod yang begitu besar, tetapi anda tidak menyatakan dengan jelas tujuan anda ingin menghantarnya atau jenis masalah yang anda hadapi.
Cara penulisan ini tidak begitu bagus~
Jika anda belajar sendiri, disyorkan untuk mencari beberapa sumber yang lebih baru dan dihasilkan lebih baik, atau MDN, jangan disesatkan
Cara mengoptimumkan secara khusus, berikut adalah dua petua :
Ejen Acara
Penutupan