大家好，又见面了，我是全栈君，今天给大家准备了Idea注册码。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>图片放大居中</title>
<meta name="description" content="">
<meta name="keywords" content="">
<style>
*{margin:0; padding:0;}
ul,li{margin-right: 0; padding:0;}
li{list-style:none;}
a{text-decoration: none;}
.clearfix:before,.clearfix:after{display: table; content: "";}
.clearfix:after{overflow: hidden; clear: both;}
.clearfix{zoom:1;}
body{width: 100%; height: 100%; background-color: #000; overflow:hidden;}
#box{width:330px; margin:100px auto; position: relative;}
#box li{width:100px; height:100px; background:red; margin:10px 10px 0 0; float:left; color:#fff; line-height:24px;}
</style>
</head>
<body>
<ul id="box" class="clearfix">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
<script src="js/app/move.js"></script>
<script>
window.onload = function(){
var aLi = document.getElementById('box').getElementsByTagName('li');
var arr = [];
var i=0;
var zIndex = 1;
for(i=0; i<aLi.length; i++){
aLi[i].innerHTML = 'left：'+aLi[i].offsetLeft + 'px' + '<br>top：'+ aLi[i].offsetTop + 'px';
arr.push({left:aLi[i].offsetLeft,top:aLi[i].offsetTop});
}
for(i=0; i<aLi.length; i++){
aLi[i].index = i;
aLi[i].style.left = arr[i].left + 'px';
aLi[i].style.top = arr[i].top + 'px';
aLi[i].style.position ='absolute';
aLi[i].style.margin = 0;
aLi[i].onmouseover = function(){
this.style.background = 'green';
this.style.zIndex=zIndex++;
startMove(this,{
width:200,
height:200,
left:arr[this.index].left - 50,
top:arr[this.index].top - 50
});
}
aLi[i].onmouseout = function(){
this.style.background = 'red';
startMove(this,{
width:100,
height:100,
left:arr[this.index].left,
top:arr[this.index].top
});
}
}
}
</script>
</body>
</html>
版权声明：本文博客原创文章。博客，未经同意，不得转载。
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请联系我们举报，一经查实，本站将立刻删除。
发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/117400.html原文链接：https://javaforall.net
