摘要：开始没明白中间的.stop()的作用，自己删除后试了下效果，明白它的作用了<!doctype html><html> <head> <meta charset="UTF-8"> <title>下滑线跟随导航作业</title> <script
开始没明白中间的.stop()的作用，自己删除后试了下效果，明白它的作用了
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>下滑线跟随导航作业</title>
<script src="jquery-3.3.1.min.js"></script>
</head>
<style>
*{margin:0;padding:0}
a{width:35px;height:100px;background:#ccc;border-bottom:1px solid #fff;display:block;text-align:center;line-height:100px;text-decoration:none;color:#fff;font-weight:bold;font-size:20px}
.underline{height:100px;border:1px solid #f00;position:absolute;top:0;left:0}
</style>
<script>
$(function(){
$('a').hover(function(){
var $x=parseInt($(this).attr('name'))*100;
$('.underline').stop().animate({top:$x+'px'},500)
},function(){
$('.underline').stop().animate({top:0},500)
})
})
</script>
<body>
<a href="#" name='0'>1</a>
<a href="#" name='1'>2</a>
<a href="#" name='2'>3</a>
<div></div>
</body>
</html>
批改老师：灭绝师太批改时间：2019-01-16 11:24:20
老师总结：很多人都会问这个问题，我的反应就是你删除试试看就知道了，这也是stop方法的作用；自己测试一下，下次遇到动画问题就知道解决了（特别是带有显示时间的效果）
