jquery - 如何根据指针创建平滑的动画悬停背景

Question

这是我想要类似的菜单（红色导航栏）

[http://www.toyota.com/avalon/#!/features][1]

当您移动鼠标时，您会注意到背景跟随鼠标，但最终居中位于菜单项后面，而不仅仅是跟随它。

我正在寻找一个示例，以便我可以从中学习并做类似的事情，因为在提到的页面中我无法获得完成这项工作的 jquery 脚本这里是准备好的测试页面

[http://jsfiddle.net/j55nM/][2]

提前致谢

Answer 1

您正在寻找“LavaLamp”jQuery 效果。

见这里：http ://www.gmarwaha.com/blog/2007/08/23/lavalamp-for-jquery-lovers/

Answer 2

大概是这样的

$('#example2 a').hover(function(e){
   var pos = $(this).position().left;
   $('img').stop().animate({left:pos}); 
});

小提琴