JQuery经常使用到的效果

toggle()

经过 jQuery，您能够使用 toggle() 方法来切换 hide() 和 show() 方法。

显示被隐藏的元素，并隐藏已显示的元素：

语法：

$(selector).toggle(speed,callback);

可选的 speed 参数规定隐藏/显示的速度，能够取如下值："slow"、"fast" 或毫秒。

可选的 callback 参数是 toggle() 方法完成后所执行的函数名称。

---

hover()

hover()方法用于模拟光标悬停事件。

当鼠标移动到元素上时，会触发指定的第一个函数(mouseenter);当鼠标移出这个元素时，会触发指定的第二个函数(mouseleave)。

$(selector).hover(
    function(){
      //执行方法 alert("执行方法一");
    },
    function(){
       //执行方法 alert("执行方法二");
    }
);

---

focus()

当元素得到焦点时，发生 focus 事件。

当经过鼠标点击选中元素或经过 tab 键定位到元素时，该元素就会得到焦点。

focus() 方法触发 focus 事件，或规定当发生 focus 事件时运行的函数：

$("input").focus(function(){
  $(this).css("background-color","#cccccc");
});

---

blur()

当元素失去焦点时，发生 blur 事件。

blur() 方法触发 blur 事件，或规定当发生 blur 事件时运行的函数：

$("input").blur(function(){
  $(this).css("background-color","#ffffff");
});

---

fadeToggle() 

jQuery fadeToggle() 方法能够在 fadeIn() 与 fadeOut() 方法之间进行切换。

若是元素已淡出，则 fadeToggle() 会向元素添加淡入效果( fadeIn() )。

若是元素已淡入，则 fadeToggle() 会向元素添加淡出效果( fadeOut() )。

$(selector).fadeToggle(speed,callback);

可选的 speed 参数规定效果的时长。它能够取如下值："slow"、"fast" 或毫秒。

可选的 callback 参数是 fading 完成后所执行的函数名称。

---

slideToggle() 

jQuery slideToggle() 方法能够在 slideDown() 与 slideUp() 方法之间进行切换。

若是元素向下滑动，则 slideToggle() 可向上滑动[ slideUp() ]它们。

若是元素向上滑动，则 slideToggle() 可向下滑动[ slideDown() ]它们。

$(selector).slideToggle(speed,callback);

可选的 speed 参数规定效果的时长。它能够取如下值："slow"、"fast" 或毫秒。

可选的 callback 参数是滑动完成后所执行的函数名称。

---

animate()

用于建立自定义动画

$(selector).animate({params},speed,callback);

必需的 params 参数定义造成动画的 CSS 属性。

可选的 speed 参数规定效果的时长。它能够取如下值："slow"、"fast" 或毫秒。

可选的 callback 参数是动画完成后所执行的函数名称。

注意：默认状况下，全部 HTML 元素都有一个静态位置，且没法移动。
如需对位置进行操做，要记得首先把元素的 CSS position 属性设置为 relative、fixed 或 absolute！

---

stop() 

stop() 方法用于中止动画或效果，在它们完成以前。

stop() 方法适用于全部 jQuery 效果函数，包括滑动、淡入淡出和自定义动画。

$(selector).stop(stopAll,goToEnd);

可选的 stopAll 参数规定是否应该清除动画队列。默认是 false，即仅中止活动的动画，容许任何排入队列的动画向后执行。

可选的 goToEnd 参数规定是否当即完成当前动画。默认是 false。

所以，默认地，stop() 会清除在被选元素上指定的当前动画。

---

jQuery 尺寸