Question

38

Jquery onmouseover image size increase

rated 0 times [ 41] [ 3] / answers: 1 / hits: 21736 / 13 Years ago, fri, march 18, 2011, 12:00:00

I am trying to do an effect where when the mouse hovers over an image the it grows large by 50% of its size and goes back as soon as the mouse moves out of its region. Can it be possible to do this with jquery? how? could it be possible to do this without jquery? how hard would it be to do it without jquery?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

angelr

Add To Favorites

Follow

Total Points: 399

Total Questions: 96

Total Answers: 101

Location: Finland

Member since Sun, May 21, 2023

1 Year ago

answered 13 Years ago kaceyr · Accepted Answer

Here you go:

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

    $(this).data('height', this.height);

}).bind('mouseenter mouseleave', function(e) {

    $(this).stop().animate({

        height: $(this).data('height') * (e.type === 'mouseenter' ? 1.5 : 1)

    });

});

Live demo: http://jsfiddle.net/simevidas/fwUMx/5/