JQuery的事件與動畫

2021-09-02 21:28:40 字數 904 閱讀 8251

toggle()方法的用法

toggle()方法用於模擬滑鼠連續單擊事件。執行為:第一次單擊執行第乙個函式,第二次單擊時執行第二個函式,可以重複呼叫,

編寫網頁或新聞時,如有標題需要對其進行解釋時可以使用toggle()方法。**如下

$(function().(function))

});

**中的標題就是我們要處理的乙個事件,我們可以根據自己的需求來寫

toggle()還有另外乙個作用,就是它可以切換元素的狀態。如果元素是可見的,單擊後會變成隱藏的。如果元素是隱藏的,單擊後會變成可見的,所以還有另外的乙個方法切換元素狀態。

$(function().(function))

});

上面的方法也可以實現切換元素狀態的目的,同樣標題也是我們自己選擇我們的需求來填寫的。

能達到toggle()方法相似效果的還有hover,hover是模仿滑鼠懸停,滑鼠懸停時執行第乙個函式,移開時執行

第二個函式

(function().(function))

});

上述的方法多用於超連結,以展示超連結的內容。

引申:上述的方法也可以用於改變background,highlight,px等其他內容,不侷限於顯示和隱藏。

對於隱藏和顯示還有幾種方法,比如改變不透明度來實現用fadein()和fadeout()來實現,還可以用由上向下延伸來顯示slieddown()和由下向上來隱藏sliedup()來實現。

下面舉乙個例子

$(function().(function))

});

這樣就顯示出了最簡單的動畫效果。

解釋:關鍵字this引用的是帶有相應行為的dom元素,為了使dom元素能夠使用jquery中的方法,使用$(this)將其轉化為jquery物件。

JQuery事件與動畫

事件綁用快捷方式 button first click function 使用on繫結事件 使用on進行單事件繫結 button on click function 使用on同時為多個事件,繫結同一函式 button on mouseover click function 呼叫函式時,傳入自定義引數...

JQuery的事件與動畫

toggle 方法的用法 toggle 方法用於模擬滑鼠連續單擊事件。執行為 第一次單擊執行第乙個函式,第二次單擊時執行第二個函式,可以重複呼叫,編寫網頁或新聞時,如有標題需要對其進行解釋時可以使用toggle 方法。如下 js 收藏 function function 中的標題就是我們要處理的乙個...

JQuery事件與動畫總結

1 載入dom 1.1.window事件 window.onload function 時機 其他資源都載入完畢後,再執行 function 只是等待標籤完畢,即可執行 區別 window.onload需在網頁所有內容載入完成之後執行 包括音訊 文件就緒函式 只需要在網頁dom結構載入以後便執行 w...