????:開始沒明白中間的.stop()的作用,自己刪除后試了下效果,明白它的作用了<!doctype html><html> <head> <meta charset="UTF-8"> <title>下滑線跟隨導(dǎo)航作業(yè)</title> <script
開始沒明白中間的.stop()的作用,自己刪除后試了下效果,明白它的作用了
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>下滑線跟隨導(dǎo)航作業(yè)</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
???? ??:很多人都會(huì)問這個(gè)問題,我的反應(yīng)就是你刪除試試看就知道了,這也是stop方法的作用;自己測(cè)試一下,下次遇到動(dòng)畫問題就知道解決了(特別是帶有顯示時(shí)間的效果)