jquery animate动画效果笔记

制作动画效果常用有2种方法

1 用脚本控制- 通过改变定位元素的宽 、 高 、left 、top 等属性实现简单的动画。

<div class="wrap">
		<div class="layout mt20">
			<div class="wx_text posr">
				<div class="dot" id="dot"></div>
			</div>
		</div>
	</div>
	<script type="text/javascript">
		$("#dot").hover(function(){
			$(this).animate({
				"left":"80"
			},'slow');
		},function(){
			$(this).animate({
				"left":"10"
			},'slow');
		})

	</script>

2 用CSS3动画 -可以用animate.css 动画类库来实现，添加animated class 来开启动画，添加Hover等特殊class实现不同的效果

api : http://daneden.github.io/animate.css/