demo 點擊圖片當前顯示變大，其他變小
<style>
*{
margin: 0;
padding: 0;
}
.box{
width: 1000px;
margin: 50px auto;
overflow: hidden;
}
.box ul{
list-style: none;
width: 4000px;
}
.box li{
float: left;
width: 200px;
}
</style>
<div class="box" id="box">
<ul id="ul">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
<script src="JavaScript/base.js"></script> // 詳情 animate() 封裝
<script>
var box = document.getElementById("box");
var ul = document.getElementById("ul");
var lis = ul.children;
for(var i = 0;i<lis.length;i++){
lis[i].onmouseover = function(){
for(var j = 0;j<lis.length;j++){
animate(lis[j],{width:100})
}
animate(this,{width:600})
};
lis[i].onmouseout = function(){
for(var j = 0;j<lis.length;j++){
animate(lis[j],{width:200})
}
}
}
</script>
最后編輯于 ：
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明：文章內容（如有圖片或視頻亦包括在內）由作者上傳并發布，文章內容僅代表作者本人觀點，簡書系信息發布平臺，僅提供信息存儲服務。
