abstrak：總結(jié)及疑問：$('.block').stop().animate({left:$x+'px'}, 300);這里的stop()有點疑惑，根據(jù)測試，把它刪掉后，每移動一個標簽，它都要回去一次，就是執(zhí)行第二個函數(shù)。個人感覺及查資料后，認為它的作用是：是當前的動畫停止，下一個動畫從當前停止的地方開始執(zhí)行。防止多次執(zhí)行動畫。（感覺描述的還不是很清楚）代碼：<!DOCT
總結(jié)及疑問：
$('.block').stop().animate({left:$x+'px'}, 300);
這里的stop()有點疑惑，根據(jù)測試，
把它刪掉后，每移動一個標簽，它都要回去一次，就是執(zhí)行第二個函數(shù)。
個人感覺及查資料后，認為它的作用是：
是當前的動畫停止，下一個動畫從當前停止的地方開始執(zhí)行。防止多次執(zhí)行動畫。（感覺描述的還不是很清楚）
代碼：
<!DOCTYPE html>
<html>
<head>
<title>下劃線跟隨導航</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);//停止當前動畫，stop()是為了阻止N個動畫一直執(zhí)行完畢。
},
function(){
$('.block').stop().animate({left:'0px'}, 300);
}
)
})
</script>
</head>
<body>
<div class="menu">
<ul>
<li name="0">首頁</li>
<li name='1'>php中文網(wǎng)</li>
<li name='2'>豬哥</li>
<li name='3'>朱老師</li>
<li name='4'>滅絕小師太</li>
<li name='5'>歐陽克</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>
Guru membetulkan：韋小寶Masa pembetulan：2019-02-15 17:52:47
Rumusan guru：stop就是停止當前執(zhí)行的動畫 你的理解沒有任何問題啊 這些東西有點疑惑的東西可以多去練習一下,使用一些不熟悉的函數(shù)去嘗試練習