日期:2014-05-17  浏览次数:20763 次

div鼠标放到图片上图片浮出放大
div鼠标放到图片上图片浮出放大,但是鼠标移至时位置总是跳动,如何解决呀!?
<html>
 <body>
  <style>
   .imglist a img{position:relative;width:100;height:200;}
   .imglist a:hover img{positon:absolute;width:200;height:400;}
   .img_1{top:3px;left:5px;}
   .img_2{top:3px;left:10px;}
   .img_3{top:3px;left;15px;}
  </style>
 <div class="imglist">
   <a href="#"><img class="img_1" src="1.jpg"></a>
   <a href="#"><img class="img_2" src="2.jpg"></a>
   <a href="#"><img class="img_3" src="3.jpg"></a>
 </div>
</body>
</html>

------解决方案--------------------

<style>
  .imglist{ margin:50px;}
.imglist a{ display:block;position:relative;width:100px;height:200px; float:left; margin:10px;}
  .imglist a img{width:100px;height:200px;}
  .imglist a:hover img{
positon:absolute;
width:200px;height:400px;
 z-index:999; 
display:block; 
left:50%; top:50%; 
margin:-200px -100px;
}
</style>

<div class="imglist">
   <a href="#"><img  src="images/car_icon.png"></a>
   <a href="#"><img  src="images/car_icon.png"></a>
   <a href="#"><img  src="images/car_icon.png"></a>
 </div>


看看这个对你有没有帮助