javascript - jquery scale scale 函数以指数方式增加大小

Question

我有一个功能，我用它在鼠标进入时放大图片并在鼠标离开时返回到正常大小。问题是，如果我在允许图片返回正常大小之前快速将鼠标移出然后将鼠标移入，那么图片将从鼠标输入时当前的任何大小放大(x2.7) (并且将不再恢复到原来的大小)......所以它变得很大!在 img 首次恢复到其原始大小之前，我将如何停止运行该函数？转到 vgtesting.co.nf(遛狗标签)看看我在做什么。

//to scale up on hover
$('#videoandmapwrap').on({
    mouseenter: function () {
        current_h = $(this, 'img')[0].height;
        current_w = $(this, 'img')[0].width;
        $(this).stop(true, false).animate({
            width: (current_w * 2.7),
            height: (current_h * 2.7)
        }, 900);
    },
    mouseleave: function () {
        $(this).stop(true, false).animate({
            width: current_w + 'px',
            height: current_h + 'px'
        }, 400);
    }
}, 'img');

Answer 1

喜欢我的评论...

您的代码似乎有效。只有一件事是两个变量。它们似乎未定义，如果 undefined variable ，则它们仅限于它们的范围(mouseenter 函数)，而不是在另一个 mouseleave 中尝试全局定义值。

var current_h,current_w; //add this line simply.
$('#videoandmapwrap').on({
    mouseenter: function () {
       //... your code
    }
}, 'img');

示例:http://jsfiddle.net/Frogmouth/Ku2fH