jQuery这不是选择单个元素

时间:2012-06-07 15:51:53

标签: jquery css

我在里面有几个图标链接:

<div class="icons">
< href="..."><img src='' /></a>
< href="..."><img src='' /></a>
...
</div>

我正在尝试使用代码使用jQuery为margin-top s IMG css属性设置动画:

$j = jQuery.noConflict();
$j("div.icons a").live({
mouseenter: 
function(){
    $j("img",this).animate({'margin-top': '-10px'}, 500);},
mouseleave:
function(){
    $j("img",this).animate({'margin-top': '-35px'}, 500);}
});

但它改变了DIV中所有图像的margin-top属性,而不仅仅是悬停的图像。我做错了什么?

你可以看到它在这里工作: http://pasterzdrzew.pl/

1 个答案:

答案 0 :(得分:2)

问题是您在链接上使用了display: inline-block;,您应该使用display:block; float:left;,这应该可以解决问题(使用Chrome的开发者工具进行测试)。

内联块并不完全是块元素,应该非常明智地使用,以防止像这样的问题,边缘不像块元素那样。