如果你要的效果是鼠标移上去放大,移开就还原的话,最好不要直接改变宽高。无需jQuery,用CSS缩放即可:
.zoomOut : hover{
-moz-transform: scale(1.04, 1.04);
-ms-transform: scale(1.04, 1.04);
-webkit-transform: scale(1.04, 1.04);
transform: scale(1.04, 1.04);
}
详细内容请参看 CSS3 transform (http://www.w3school.com.cn/cssref/pr_transform.asp)
和CSS hover (http://www.w3school.com.cn/cssref/selector_hover.asp)
容器relative定位,hover的时候将图片absolute定位后放大,不过去前提是容器得定宽高,要不会闪动,这种纯css可以搞定。
如果不兼容ie8-,用css3的scale也行
给父容器定宽高,设置overflow:hidden,设置父容器hover查找下面的图片改变宽高