Search code examples
jqueryhtmlcssonmouseoverlightgallery

Add Class on ready, remove class on mouseenter

I'm creating my portfolio website. I'm looking to add class on document ready, and remove/change that class to a different class on hover. I'm using lightgallery & CSS gram filters to my images on load and hover. Previously, I added a list. Unfortunately it did not work well for my needs. Previous code

$("#gallery a").on({
  mouseenter : function() {
    $(this).find(".nak-gallery-poster").removeClass("inkwell").addClass("mayfair");
  },
  mouseleave : function() {
    $(this).find(".nak-gallery-poster").removeClass("mayfair").addClass("inkwell");
  }
});

I altered the jQuery to match the content from the previous code. This did not work. Please Help. My CodePen

Solution

  • remove code 

    $lg.lightGallery();
  $lg.append(slide);
  $lg.data('lightGallery').destroy(true);
  $lg.lightGallery();

    from your codepen, then all works fine

    seems like you missed some plugin or placed wrong code