回覆列表
-
1 # 資深老饕ysy
-
2 # 鳳棲hyh
1、為了操作方便,我們這裡使用jquery來操作,所以先引入jquery指令碼庫檔案。
2、html裡,我們新增一個id為mouse的div就行了,裡面有一些顯示資訊。
3、接著我們就可以新增js事件了,透過新增mouseover事件,我們就可以實現滑鼠移進的邏輯事件了,在這裡我們為p元素設定資訊,提示滑鼠移進了。
4、同理新增mouseout事件,就是滑鼠移出的事件了。
5、執行頁面,可以看到一個div裡有一段檔案,我們嘗試把滑鼠移動到div裡。
6、移進去後,就可以看到有文字顯示出來,提示滑鼠已經移進來了。
7、滑鼠移出後,也有對應的提示。我們的程式碼正確運行了。當然實際情況下,我們可以在滑鼠移進去時顯示一個視窗,圖片等等。滑鼠移出後,再隱藏掉這些內容。邏輯上都是一樣的實現,就看大家的需求是怎樣的了。
1.為了操作方便,我們這裡使用jquery來操作,所以先引入jquery指令碼庫檔案。
2.html裡,我們新增一個id為mouse的div就行了,裡面有一些顯示資訊。
3.接著我們就可以新增js事件了,透過新增mouseover事件,我們就可以實現滑鼠移進的邏輯事件了,在這裡我們為p元素設定資訊,提示滑鼠移進了。
4.同理新增mouseout事件,就是滑鼠移出的事件了。
5.執行頁面,可以看到一個div裡有一段檔案,我們嘗試把滑鼠移動到div裡。
6.移進去後,就可以看到有文字顯示出來,提示滑鼠已經移進來了。
7.滑鼠移出後,也有對應的提示。我們的程式碼正確運行了。當然實際情況下,我們可以在滑鼠移進去時顯示一個視窗,圖片等等。滑鼠移出後,再隱藏掉這些內容。邏輯上都是一樣的實現,就看大家的需求是怎樣的了。