缩放的元素不会保持缩放

Question

当我使用jquery将一个元素缩放50 %时，它首先变小，然后返回到原始大小。

我想这是由于切换功能造成的。

$(".target").toggle( "scale", 
          {percent: 50, direction: 'horizontal'}, 2000 );

我如何缩放和元素，并坚持缩放的大小？

我不想应用css类，只想使用jquery。

Answer 1

我相信您正在使用jquery UI。如果是这样的话，你必须按照他们的文档重写你的代码：

$(".target").toggle({ 
    effect: "scale", 
    direction: "horizontal",
    percent: 50 ,
    duration: 2000
});

然而，这不会给你你正在寻找的东西，因为toggle最终隐藏/显示了一个元素。你需要调查一下animate。实现这一点的最好方法是将.target元素包装在另一个div中，然后通过同时提供left和width来实现动画效果，这应该会引导您朝着正确的方向前进：

$(".target").animate({
    width: '50%',
    left: '25%'
}, 2000);

为了进一步帮助您，我创建了一个。看看这个。