Jquery 简单的图像大小调整问题

当用户悬停在我的图像上时，我试图放大图像，当悬停在外时，我试图将图像恢复到原来的高度和宽度。 我无法将图像大小放大到我想要的值。当我悬停时，图像似乎变得非常大。不知道我做错了什么。 谢谢你的帮助

$('#image_layout').on({
        mouseenter: function() {
            var $this=$(this);
            console.log($this.height());
            $(this).css("z-index", 1).animate({
                    height: "120%",
                    width: "120%"                    
                }, "fast");

            $(this).after('hfdsuhods');
        },
        mouseleave: function() {
            $(this).css("z-index", 0).animate({
                    height: "100%",
                    width: "100%"

                }, "fast");
        }
     }, "img");




//images are from ajax call and the sizes are varies. 
<div id='image_layout'>
    <img src='a.jpg' />
    <img src='b.jpg' />
    <img src='c.jpg' />
</div>   

这段代码意味着使图像的大小达到120%，这意味着图像比原来的大小大20%。如果图像已经相当大，这会使其增加20%。我会把这些值改成你更喜欢的值，从105%开始，然后继续。这不会是一个非常大的增长，但它至少会阻止它在你悬停时变得非常大

                height: "120%",
                width: "120%"