jQuery로 호버 상태를 강제하는 방법은 무엇입니까?

jQuery로 호버 상태를 강제하는 방법은 무엇입니까?

---

이 CSS 코드를 고려하십시오.

a { color: #ffcc00; }
a:hover { color: #ccff00; }

이 HTML 코드 :

<a href="#" id="link">Link</a>
<button id="btn">Click here</button>

그리고 마지막으로이 JS 코드 :

$("#btn").click(function() {
   $("#link").trigger("hover");
});

버튼을 클릭하면 내 링크가 의사 클래스 : hover를 사용하도록 만들고 싶습니다. mousemove, mouseenter, hover 등과 같은 이벤트를 트리거하려고 시도했지만 누구나 작동합니다. 내 CSS 의사 클래스 : hover 사양을 강제로 사용하고 다음과 같은 것을 사용하지 않으려 고합니다.

$("#link").css("color", "ccff00");

어떤 사람은 내가 이걸 어떻게하는지 알아? 정말 고마워.

---

클래스를 사용해야하지만 걱정하지 마세요. 매우 간단합니다. 먼저 :hover물리적으로 호버 된 링크뿐만 아니라 클래스 이름이있는 링크에도 적용되도록 규칙을 할당합니다 hovered.

a:hover, a.hovered { color: #ccff00; }

다음 #btn으로을 클릭 .hovered하면 #link.

$("#btn").click(function() {
   $("#link").toggleClass("hovered");
});

링크에 이미 클래스가있는 경우 제거됩니다. 클래스가 없으면 추가됩니다.

---

또한 마우스 오버를 트리거 할 수 있습니다.

$("#btn").click(function() {
   $("#link").trigger("mouseover");
});

이것이 특정 시나리오에서 작동하는지 확실하지 않지만 다양한 경우에 마우스 오버 대신 마우스 오버를 트리거하는 데 성공했습니다.

---

내가 만난 최고의 솔루션은이 stackoverflow 에 있다고 생각합니다 . 이 짧은 jQuery 코드를 사용하면 모든 호버 효과를 클릭 또는 터치시 표시
할 수 있습니다. 함수 내에 아무것도 추가 할 필요가 없습니다.

$('body').on('touchstart', function() {});

도움이 되었기를 바랍니다.

참고 URL : https://stackoverflow.com/questions/2290829/how-to-force-a-hover-state-with-jquery