Search code examples
javascriptjquerycsshovertoggleclass

jquery if class then hover effect

I have a click handler that toggles a class, and a hover effect that changes a background color. I'd like to disable the hover effect if the class has been toggled.

Here's what I have so far:

    $('#plan td.n').bind('click', function() {
    $(this).toggleClass('selected n');
});

$('#tblThings td.n').hover(function()
{
  if ( $( this ).hasClass( "selected" ) )
  {
          $( this ).css('background-color', '#63D3FF');
  }
};

Many thanks for your time

Solution

  • You'd have to check the same elements for the class?

    $('#plan td.n').on('click', function() {
    $(this).toggleClass('selected n');
});

$('#tblThings td.n').hover(function() {
    if ( $('#plan td.n').hasClass( "selected" ) ) {
        $( this ).css('background-color', '#63D3FF');
    }
});