JQuery.addClass not working

Question

This looks correct, but does not work. I would like the "huh" div to become opaque when the menu freezes. I tried this with fadein / out and it worked, but only once, which was strange.

<script type="text/javascript"> $( function() { $('#menuNav').hover( function() { $('#huh').addClass('.opacity'); }, function(){ $('#huh').removeClass('.opacity'); }); }); </script> .opacity { opacity: 0.3; } 

Answer 1

Use it without a dot:

  $(function(){ $('#menuNav').hover(function(){ $('#huh').addClass('opacity'); }, function(){ $('#huh').removeClass('opacity'); }); }); 

Answer 2

.hover() does a lot of events, it is better to use .mouseenter() . Note also that when you add a class, you do not . (point).

 $(function(){ $('#menuNav').mouseenter(function(){ $('#huh').addClass('opacity'); }, function(){ $('#huh').removeClass('opacity'); }); }); 

Answer 3

Used to delete .

  $('#huh').addClass('opacity'); // remove . $('#huh').removeClass('opacity'); // remove . 

===============

Or used to

 toggleClass in jquery 

---

 $(function(){ $('#menuNav').hover(function(){ $('#huh').toggleClass('opacity'); }); }); 

More on this

Answer 4

 $( function() { $('#menuNav').hover( function() { $('#huh').toggleClass('opacity'); }); }); 

Answer 5

try it

  <script> $(function(){ $('#menuNav').hover(function(){ $('#huh').addClass('opacity'); }, function(){ $('#huh').removeClass('opacity'); }); }); </script> 

Answer 6

You have one . in the name of your class in addClass and removeClass , you need to add and remove without a dot when calling these methods. i.e.

 $(function() { $('#menuNav').hover(function(){ $('#huh').addClass('opacity'); }, function(){ $('#huh').removeClass('opacity'); }); }); 

Answer 7

. delete and then use this javascript

  $(function(){ $('#menuNav').hover(function(){ $('#huh').addClass('opacity'); }, function(){ $('#huh').removeClass('opacity'); }); }); 

Answer 8

try it

 $("#menuNav").mouseenter(function() { $('#huh').addClass('opacity'); }).mouseleave(function() { $('#huh').removeClass('opacity'); });