jquery中的事件以及动画

1.jquery中事件的写法

（1）基本写法

jquery中可以进行链式操作，所以可以在 click事件后边继续加事件。

（2）通过事件对象来获取元素节点

按钮

（3）用bind()绑定事件 

按钮

其中bind()中的三个参数type(事件类型)，data（一个回调函数产生的结果），fn(每个元素选择事件的函数) 如果要添加多个事件，只需把事件用空格隔开。

移除对象的事件 如果不带参数 指事件全部移除 带参数指的是移除当前的指定事件

$("#btn").bind("click",function(){
       console.log(1);
   }).unbind();

（4）事件的切换   hover    toggle

1）hover (over out)   当鼠标移入至所选元素上时，触发第一个函数，当鼠标移出该元素时，触发第二个函数

2）toggle（）依次对多个函数进行调用直到第最后一个函数，然后对这些函数重复调用

2、jquery中封装的动画

（1）显示与隐藏

 $("#btn").click(function (){
     $(".block").hide(1000,function (){
     alert(1)
     });
 });

$("#btn1").click(function (){
     $(".block").show(1000,function (){
     alert(2)
     });
 });

（2）滑动效果

$("#btn").click(function (){
     $(".block").slideUp();//上滑
     $(".block").slideDown();//下滑
 });

（3）淡入淡出的动画

//淡出
$("#btn").click(function (){
     $(".block").fadeOut(500);
     $(".block").fadeToggle(500);
});

//淡入
$("#btn1").click(function (){
     $(".block").fadeIn(500);
});

（4）透明度变化动画

$("#btn").click(function (){
     $(".block").fadeOut(500);
     $(".block").fadeTo(1000,0.5,function (){
     alert(1)
     });
 });