1

I'd like to understand and know if it's possible to trigger a hover if a HTML dom contains a specific class.

So far from what I researched, it seems to be impossible, but here is a fiddle with the example trying to add a pink color to the text2 via CSS.

$(document).ready(function(){
    if($(".aside-navigation > ul li").hasClass("nav-active") ) {
        $('.nav-active i').trigger('mouseenter');
    }
});
.nav-active i:hover { color: pink; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="aside-navigation">
  <ul>
    <li class="">
      <i>text</i>
    </li>
    <li class="nav-active">
      <i>text 2 (hover here)</i>
    </li>
  </ul>
</div>
Stark
  • 572
  • 10
  • 24
  • You're approaching the problem from the wrong side. You can't programmatically create a 'hover' event, that comes from the browser. However, you can mimic it almost like you're doing. Rather than `trigger('mouseenter')`, you should setup an event listener on your target element for `mouseenter` and `mouseleave`, then add/remove a class respectively. – Geuis Jul 21 '17 at 21:29
  • You don't need to test for the class. Just query the DOM for the class, if it exists, it will get the event handler. If not, it won't. `$(".aside-navigation > ul li").trigger('mouseenter')` – Scott Marcus Jul 21 '17 at 21:30

0 Answers0