如何在JavaScript中使图像x％更大（使用jQuery） [英] How to make an image x% bigger in JavaScript (with jQuery)

问题描述

我认为这应该是一件简单明了的事情，但我没有看到明确的方法。

I thought this ought to be a straightforward thing to do, but I don't see a clear way to do it.

我想这样做当用户将鼠标悬停在图像上时，图像变大10％，然后当用户将鼠标移开时返回其原始大小。

I would like to make it so that when a user hovers the mouse over an image, the image becomes 10% bigger and then returns to its original size when the user moves the mouse away.

我认为我想使用jQuery hover 函数，但我不知道要传递到 hover 的函数。

I think that I will want to use the jQuery hover function, but I don't know what functions to pass into hover.

$('.resizableImage').hover(makeBigger, returnToOriginalSize);

推荐答案

jQuery允许你使用 + = 和％。所以这两个人一起做你想做的事。

jQuery lets you use += and %. So those two together will do what you want.

$('.resizableImage').hover(makeBigger, returnToOriginalSize);

function makeBigger() {
    $(this).css({height: '+=10%', width: '+=10%'});
}
function returnToOriginalSize() {
    $(this).css({height: "", width: ""});
}

DEMO： http://jsfiddle.net/rZaAE/

这篇关于如何在JavaScript中使图像x％更大（使用jQuery）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！