html鼠标悬浮时图片变模糊,鼠标hover过图片时候图片放大并消除模糊会导致其他图片振一下...

html>

.new-image{

width: 25%;

height:300px;

float:left;

overflow:hidden;

background:#333;

}

.new-image-img{

transition:all .6s;

-webkit-filter:blur(3px);

-ms-filter:blur(3px);

filter:blur(3px);

transform: scale(1, 1);

}

.new-image-class{

transition:transform .6s;

transform: scale(1.2, 1.2);

}

$(".new-image").hover(function(){

$(this).children("img").removeClass("new-image-img").addClass("new-image-class");

},function(){

$(this).children("img").removeClass("new-image-class").addClass("new-image-img");

});

代码如上，比如说鼠标放在第一张图上时后三张图片的链接处都会振一下，不是很显眼。hover第二张后两张会振。hover最后一张前三张不会振动，为什么会出现这样的问题啊？求大神