摘要：總結(jié)及疑問(wèn)：$('.block').stop().animate({left:$x+'px'}, 300);這里的stop()有點(diǎn)疑惑，根據(jù)測(cè)試，把它刪掉后，每移動(dòng)一個(gè)標(biāo)簽，它都要回去一次，就是執(zhí)行第二個(gè)函數(shù)。個(gè)人感覺(jué)及查資料后，認(rèn)為它的作用是：是當(dāng)前的動(dòng)畫(huà)停止，下一個(gè)動(dòng)畫(huà)從當(dāng)前停止的地方開(kāi)始執(zhí)行。防止多次執(zhí)行動(dòng)畫(huà)。（感覺(jué)描述的還不是很清楚）代碼：<!DOCT
總結(jié)及疑問(wèn)：
$('.block').stop().animate({left:$x+'px'}, 300);
這里的stop()有點(diǎn)疑惑，根據(jù)測(cè)試，
把它刪掉后，每移動(dòng)一個(gè)標(biāo)簽，它都要回去一次，就是執(zhí)行第二個(gè)函數(shù)。
個(gè)人感覺(jué)及查資料后，認(rèn)為它的作用是：
是當(dāng)前的動(dòng)畫(huà)停止，下一個(gè)動(dòng)畫(huà)從當(dāng)前停止的地方開(kāi)始執(zhí)行。防止多次執(zhí)行動(dòng)畫(huà)。（感覺(jué)描述的還不是很清楚）
代碼：
<!DOCTYPE html>
<html>
<head>
<title>下劃線跟隨導(dǎo)航</title>
<meta charset="utf-8">
<script type="text/javascript" src="jq.js"></script>
<style type="text/css">
*{
padding:0px; margin:0px;
}
ul{
list-style: none; z-index: 20; position: relative; font-size: 15px;
}
li{
float:left;
cursor:pointer;
width:100px;
height:30px;
text-align: center;
line-height: 30px;
color:#fff;
font-weight: bold;
}
.menu{
width:700px;
position:relative;
margin:20px auto;
height:32px;
box-shadow: 0px 2px 20px #000;
background:#af3434;
border-radius: 3px;
}
</style>
<script type="text/javascript">
$(function(){
$('li').hover(
function(){
$x = parseInt($(this).attr('name'))*100;
$('.block').stop().animate({left:$x+'px'}, 300);//停止當(dāng)前動(dòng)畫(huà)，stop()是為了阻止N個(gè)動(dòng)畫(huà)一直執(zhí)行完畢。
},
function(){
$('.block').stop().animate({left:'0px'}, 300);
}
)
})
</script>
</head>
<body>
<div class="menu">
<ul>
<li name="0">首頁(yè)</li>
<li name='1'>php中文網(wǎng)</li>
<li name='2'>豬哥</li>
<li name='3'>朱老師</li>
<li name='4'>滅絕小師太</li>
<li name='5'>歐陽(yáng)克</li>
<li name='6'>韋小寶</li>
</ul>
<div class="block" style="z-index: 10; width:100px; height:2px; background:#fff; position:absolute; top:30px;"></div>
</div>
</body>
</html>
批改老師：韋小寶批改時(shí)間：2019-02-15 17:52:47
老師總結(jié)：stop就是停止當(dāng)前執(zhí)行的動(dòng)畫(huà) 你的理解沒(méi)有任何問(wèn)題啊 這些東西有點(diǎn)疑惑的東西可以多去練習(xí)一下,使用一些不熟悉的函數(shù)去嘗試練習(xí)