Jquery 使用心得

1. 最好不要在动画中使用 += 或者 获取当前的动画运行时中的 paddingLeft、paddingRight、width、height 等等 ，然后 + 、-、*、/、+= 等等 ， 因为当前一个动画还没有结束的时候就有可能报JS错。比如：

$("#main-nav li a.nav-top-item").hover(    
			function()
			{
			    $(this).stop().animate({ paddingLeft: "+=10px" }, 200);
			},
			function()
			{
			    $(this).stop().animate({ paddingLeft: "-=10px" });
			}
    );

上面的代码当动画非常频繁的时候，有可能报JS错误，并且 paddingLeft 也不会恢复。应该写一个固定的值或用Jquery 的 data 方法保存原始 paddingLeft，比如：

$("#main-nav li a.nav-top-item").hover(   
			function()
			{
			    $(this).stop().animate({ paddingLeft: "25px" }, 200);
			},
			function()
			{
			    $(this).stop().animate({ paddingLeft: "15px" });
			}
    );

或者下面这种方法（推荐）：

$("#main-nav li a.nav-top-item").hover(   
			function()
			{
			    $(this).stop().animate({ paddingLeft: "25px" }, 200);
			},
			function()
			{
			    $(this).stop().animate({ paddingLeft: "15px" });
			}
    ).each(function(i)
    {
        $(this).data("originalPaddingLeft", $(this).css("paddingLeft"));
    });

2.如图：

谢谢浏览！