Help me with this css problem

[delta]

I have an image, heres the css. It all works fine but my p roblem is that when I remove the hovering mouse away from the img, or if the image moves away from the mouse because of the :hover css, then the image goes back to its default location, how can i keep this from happening? I dont want the :hover to only apply while the mouse hovers over the image, I want it to apply the second it hovers over the image and to stay that way. Can this be done with CSS or do I need Javascript?

#img{ top: 0; left:0;}

#img:hover{ bottom: 0; left: 50; }

[Shikkediel]

I dont want the :hover to only apply while the mouse hovers over the image, I want it to apply the second it hovers over the image and to stay that way.

This is a bit unclear but my guess is you’ll need JS, most likely the mouseenter event.

[Shikkediel]

I’m assuming you’ll be using jQuery…

.hovered {
bottom: 0;
left: 50;
}

$('img').mouseenter(function() {

  $(this).addClass('hovered');
});

[Author]

Posts