jquery 链接_jQuery链接微调

jquery 链接

A few weeks back I wrote an article about MooTools Link Nudging, which is essentially a classy, subtle link animation achieved by adding left padding on mouseover and removing it on mouseout. Here's how to do it using jQuery:

几周前，我写了一篇有关MooTools Link Nudging的文章，它本质上是一种优雅的，微妙的链接动画，它是通过在mouseover上添加左填充并在mouseout上将其删除来实现的。 这是使用jQuery的方法：

View Demo 观看演示

jQuery JavaScript (The jQuery JavaScript)

$(document).ready(function() {
	$('a.nudge').hover(function() { //mouse in
		$(this).animate({ paddingLeft: '20px' }, 400);
	}, function() { //mouse out
		$(this).animate({ paddingLeft: 0 }, 400);
	});
});

It's important to keep the nudge small and quick, so I set the animation to 20 pixels over 400 milliseconds.

保持微调的大小和速度非常重要，因此我将动画设置为400毫秒内20像素。

View Demo 观看演示

翻译自: https://davidwalsh.name/jquery-link-nudging

jquery 链接