您的位置:首页 > 其它

dock1

2016-07-13 19:18 204 查看
<!DOCTYPE html>
<html>
<head>
<meta
charset="UTF-8">
<title></title>
<style
type="text/css">
.wrap{
position:
fixed;
bottom:
0;
left:
50%;
margin-left:-275px ;
transform: rotate(180deg);
}
.wrap>div{
width:
100px;
height:
100px;
background-color: aquamarine;
float:
left;
margin-left:
10px;
transition:
all 0.5s;

}
</style>
</head>
<body>
<div
class="wrap">
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
</div>
<script
type="text/javascript">
var
divs = document.querySelectorAll(".wrap>div");
for
(var i = 0; i
< divs.length; i++) {
divs[i].onmouseover
= function(){
this.style.width
= "200px";
this.style.height
= "200px";
}
divs[i].onmouseout
= function(){
this.style.width
= "";
this.style.height
= "";
}
}
</script>
</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  dock