JavaScript를 사용하여 CSS :hover 효과 비활성화
CSS 스타일을 유지하면서 JavaScript로 더 부드러운 호버 효과를 얻는 것은 어려울 수 있습니다. 이를 극복하는 방법은 다음과 같습니다.
문제 설명:
JavaScript를 사용할 수 있는 경우 브라우저가 특정 요소에 CSS :hover 효과를 적용하지 못하도록 합니다.
해결책:
:hover 상태를 비활성화하는 순수한 JavaScript 메커니즘은 없습니다. 그러나 해결 방법은 클래스를 사용하여 CSS 및 JavaScript에서 호버 효과를 제어하는 것입니다.
HTML:
CSS:
JavaScript:
JavaScript가 로드되면
예:
<body class="nojQuery">
body.nojQuery ul#mainFilter a:hover {
/* CSS-only hover styles here */
}$(function() {
$('body').removeClass('nojQuery');
});이 접근 방식을 사용하면 JavaScript로 CSS 호버 효과를 재정의할 수 있습니다. 각 개별 속성을 명시적으로 재설정해야 합니다.
위 내용은 JavaScript가 CSS :hover 효과를 어떻게 비활성화할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
