Question

我正在尝试实现图像缩放效果（因为它位于具有溢出的容器中：隐藏，增加它的宽度并向左滑动应该可以解决这个问题。）

我设法让它增加宽度：

/* Zoom in images */
$('img.vectimg').load(function() {
    $(this).data('width', this.width);
}).bind('mouseenter mouseleave', function(e) {
    $(this).stop().animate({
        width: $(this).data('width') * (e.type === 'mouseenter' ?  1.2 : 1)
    });
});

但是如何添加动画以将其移动到左侧？我尝试追加这个/但它没有用。

$(this).stop().animate({
            left: $(this).position().left  + 500
        });

我是一个完整的新手，所以请不要带我努力：）

Answer 1

您可以在同一个animate()来电中添加多个属性。

$(this).stop().animate({
    width: $(this).data('width') * (e.type === 'mouseenter' ?  1.2 : 1),
    left: $(this).position().left + (e.type === 'mouseenter' ? 500 : -500)
});

了解详情：http://api.jquery.com/animate/

Answer 2

使用jQuery animate()回调函数进行下一个动画。

查看文档here.

注意：您必须将元素的position设置为relative（在CSS中）才能操纵左，右属性等。

如何在jQuery中添加第二个动画？

2 个答案: