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 尺寸