How to remove the attr() value on mouseout

Question

I am using this code for set height and width for a image on mouseover

$('#gallery').find("img").attr('height', '20px');
$('#gallery').find("img").attr('width','20px');

//so here the default height and width are changed by the javascript above

When mouseout how to remove the height and width of the image set by the mouseover

Answer 1

Use hover():

$('#gallery').hover(
    function(){
        // mouseover
        $(this).find("img").attr({'height':'20px', 'width':'20px'});
    },
    function(){
        // mouseout
        $(this).find('img').removeAttr('height').removeAttr('width');
        /* as of jQuery 1.7, it's possible to remove multiple attributes at once:
           $(this).removeAttr('height width'); */
    });

JS Fiddle demo.

JS Fiddle demo, using .removeAttr('height width').

References:

• hover().
• removeAttr().