Jquery Mouseenter Click to Remove Class Not Working
Posted
by
Sundance.101
on Stack Overflow
See other posts from Stack Overflow
or by Sundance.101
Published on 2012-07-06T21:12:11Z
Indexed on
2012/07/06
21:15 UTC
Read the original article
Hit count: 213
jQuery
I'm really hoping someone can help. I have an unordered list of anchors that fades in opacity (the css defaults it to 0.7) on on mouseenter, and out again on mouseleave.
On click, I want to add a class that makes the opacity stay at full. Got that far, but removing the class from the matched elements doesn't work at the moment - the other items that have had the class stay at full opacity, too.
Here is the Jquery:
$(document).ready(function(){
$("#nav a").mouseenter(function(){
$(this).fadeTo("slow",1);
$("#nav a").click(function(){
$(".activeList").removeClass("activeList"); //THIS PART ISN'T WORKING
$(this).addClass("activeList");
});
});
$("#nav a").mouseleave(function(){
if (!$(this).hasClass("activeList"))
{
$(this).fadeTo("fast",0.7);
}
});
});
I think it's because I'm stuck in the element because of mouseenter and can only affect (this). Have tried .bind/.unbind, have tried the add/remove class on it's own (it worked) and a few other things, but no luck so far! Any suggestions would be greatly appreciated.
© Stack Overflow or respective owner