abstrait：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
<style>
ul li{
width:50px;
background:brown;
color:#fff;
margin-bottom:10px;
list-style: none;
height:30px;
line-height:30px;
}
ul{
padding:0;
}
</style>
</head>
<body>
<div id="box" style="position:relative;width:200px;height:200px;background-color:blue;"></div>
<br>
<ul>
<li>導(dǎo)航1</li>
<li>導(dǎo)航2</li>
<li>導(dǎo)航3</li>
<li>導(dǎo)航4</li>
<li>導(dǎo)航5</li>
<li>導(dǎo)航6</li>
</ul>
<script>
$('ul li').hover(function(){
$(this).animate({
width:'500px'
},500);
},function(){
$(this).animate({
width:'50px'
},500);
})
</script>
</body>
</html>通過JQ獲取元素 然后添加事件執(zhí)行的操作 animate的第一個(gè)參數(shù)是動(dòng)畫變更的內(nèi)容，第二個(gè)參數(shù)是動(dòng)畫執(zhí)行時(shí)間，第三參數(shù)是動(dòng)畫完畢后執(zhí)行的代碼。
stop()可以停止動(dòng)畫執(zhí)行 stop第一個(gè)參數(shù)為布爾型 是否停止這個(gè)元素上當(dāng)前的所有隊(duì)列的動(dòng)畫，第二個(gè)參數(shù)布爾型 是否立即完成當(dāng)前動(dòng)畫。
Professeur correcteur：查無此人Temps de correction：2019-05-07 09:38:15
Résumé du professeur：完成的不錯(cuò)。動(dòng)畫要配合絢麗的樣式。繼續(xù)加油。