How to keep the hover when your mouse is not hover, Jquery?

This looks like a job for classes! When the click event is triggered, add a class to #first that has the same CSS as :hover. Div#first:hover,div#first.

Hover{ width:200px; height:200px; background-color:blue; } And then, add the class on click: $('#first'). Click(function() { $(this). AddClass('hover'); $('#second').show(); }); Remove the class and black box, when you click elsewhere: $('body').

Click(function(e) { if(!$(e. Target). Is('#first')){ $('#first').

RemoveClass('hover'); $('#second').hide(); } }); DEMO: http://jsfiddle.net/EjKKP.

1 You beet me to the answer. Here's the jsfiddle code update. – Micah Jan 4 at 21:52 What should I do if I don't want to lose the black box when I click on it, since I got link in it – Charles Lemarier Jan 4 at 21:57 1 Nvm, if I got link in it, it will change page so it's ok!

Thanks :)! – Charles Lemarier Jan 4 at 22:01 @CharlesLemarier: Edit the body click event to not trigger on that either. Or take at look at the other answers.E.stopPropagation(); is the way to do it.

– Rocket Jan 4 at 22:02.

Here's an update jsFiddle: jsfiddle.net/XYbmE/87/ JS // This will take care of restoring the boxes // when user clicks outside the boxes $(document). Click(function() { $('#first'). RemoveClass('active'); $('#second').hide(); }); // This will add an "active" class and prevent // the above code from being triggered when // the box is clicked.

$('#first'). Click(function(e) { e.stopPropagation(); $(this). AddClass('active'); $('#second').show(); }); CSS /* Have #first.

Active:hover look/behave the same as #first */ div#first:hover, div#first. Active { width:200px; height:200px; background-color:blue; }.

In your jsFiddle the box doesn't stay blue when the black box is open. OP said "I want the div#first to stay blue if the black box is there. " – SKS Jan 4 at 22:01 @SKS: You're right.Fixed.

Thanks. – Ayman Safadi Jan 4 at 22:06.

Additionally, For 2nd Question, you need to add a small script on document. Click to hide and remove class. $('#first').

Click(function(e) { $(this). AddClass('hover'); $('#second').show(); //stop bubbling e.stopPropagation(); }); $(document). Click (function (e) { if (this.Id == 'first') { return; } $('#first').

RemoveClass('hover'); $('#second').hide(); }); DEMO here.

I cant really gove you an answer,but what I can give you is a way to a solution, that is you have to find the anglde that you relate to or peaks your interest. A good paper is one that people get drawn into because it reaches them ln some way.As for me WW11 to me, I think of the holocaust and the effect it had on the survivors, their families and those who stood by and did nothing until it was too late.

Related Questions