Let's assume I have a div with a .description
class.
I would like div.description
to be shown when user hovers over another div, with the .image
class.
However, when user clicks on div.image
, I would like div.description
to stay visible. So if user clicks on .image
, the mouseleave
event should not be applied.
Lastly, when user clicks on the .image
again, the hover function should be activated again. So that when mouse leaves .image1
, div.description
will be hidden again.
Hope you guys can help me!
var cancel = false;
$(".another").hover(function(){
$("div.description").show();
},function(){
if(!cancel)
$("div.description").hide();
});
$(".image").click(function(){
cancel = (cancel)?false: true;
});