在Web 開發中，當使用者將滑鼠停留在元素上時，CSS 的「:hover」效果會向元素添加視覺變化。但是，在某些情況下，您可能想要停用此預設行為並使用 JavaScript 實作自訂效果。
問題：
一位 Web 開發人員遇到了一個問題：想要阻止瀏覽器應用 CSS 中定義的「:hover」效果。他們的目標是使用 JavaScript 創建更流暢的懸停動畫，但在覆蓋現有 CSS 樣式方面面臨挑戰。
嘗試的解決方案：
開發人員嘗試使用jQuery 懸停（ ) 函數來防止預設行為，但它沒有產生所需的結果
答案：
直接使用JavaScript禁用“:hover”效果是不可能的。在樣式方面，CSS 優先於 JavaScript。不過，還有其他方法可以達到類似的效果。
一種解決方法涉及使用HTML、CSS 和JavaScript 的組合：
HTML：
使用「nojQuery」類別標記body 元素預設值。
CSS:
限制 CSS 中的「:hover」樣式僅在存在「nojQuery」類別時套用。
JavaScript:
載入時jQuery 函式庫，從 body 元素中刪除「nojQuery」類，從而有效地啟用 CSS 懸停樣式。
透過實作此解決方法，瀏覽器將僅在載入 JavaScript 後套用 CSS 懸停樣式，並且「nojQuery」類別會被刪除。此方法可讓您使用自訂 JavaScript 效果來建立更平滑的懸停動畫，同時在 JavaScript 不可用時保留原始 CSS 懸停行為。
以上是如何使用 JavaScript 停用 CSS :hover 效果？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
