jQuery - 上下滑动特定距离

我有一个列表，其中的列表项显示为内联 block ，因此它们是水平的。

我正在尝试使用 jquery 将元素悬停时向上滑动 20px，当鼠标离开时向下滑动 20px。

与此处的产品图片完全一样:http://www.google.co.uk/nexus/

slideUp 和 slideDown 似乎不允许这样做。如何实现？

此外，如果它提供更平滑的效果，我愿意使用 css 过渡，但同样，我不知道该怎么做。

我的标记如下:

<div>
    <ul>
        <li>Item 1</li>
        <li>Item 2</li>
        <li>Item 3</li>
    </ul>
</div>

最佳答案

使用 jQuery.animate():http://api.jquery.com/animate/

$("element").animate({marginTop : "-20px"}, 500);

这是使用 samrap 提供的示例标记的 CSS 转换方法(无 javascript)的 fiddle :http://jsfiddle.net/qAeFH/

关于jQuery - 上下滑动特定距离，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18242583/