jquery：滑動兩個div與放大/縮小效果

我有兩個<股利>leftdiv和rightdiv都與50％的寬度。jquery：滑動兩個div與放大/縮小效果

leftdiv向左滑動，寬度增加看起來像放大效果。

相同的情況發生在rightdiv。

這裏是我的代碼：

css

.leftdiv { 
position:fixed; 
top:0; 
left:0px; 
width:50%; 
-webkit-transition:all 2.0s ease; 
-moz-transition:all 2.0s ease; 
-o-transition:all 2.0s ease; 
transition:all 2.0s ease; 
} 
.rightdiv { 
position:fixed; 
top:0; 
right:0px; 
width:50%; 
-webkit-transition:all 2.0s ease; 
    -moz-transition:all 2.0s ease; 
    -o-transition:all 2.0s ease; 
    transition:all 2.0s ease; 
}

JQUERY

jQuery('.leftdiv').stop().animate({ right: '-90%' }); 
$('.leftdiv').css('width','80%'); 
jQuery('.rightdiv').stop().animate({ left: '-90%' }); 
$('.rightdiv').css('width','80%');

此代碼滑出leftdiv左，rightdiv到右分別是我想要的，但在滑梯滑出前一點，然後它滑出。

可能是因爲寬度的增加。

我該如何糾正這一點。我可以在增加寬度之前添加計時或delay以糾正它。

來源

2015-02-24 Gaurav Manral

我不知道你是否意識到這一點，JQuery的'.animate（）'函數也採取另一個參數，這是結束動畫回調。你想在'right'後加大寬度：'-90％''完成了嗎？ – 2015-02-24 08:09:16

我想增加寬度以及'右：' - 90％'。以便它看起來像放大效果。我做錯了嗎？?? – 2015-02-24 08:11:09

好吧，你可以像這樣堆棧動畫：'jQuery（'。leftdiv'）。stop（）。animate（{right：'-90％'}）。animate（{width：'80％'}）; 。 – 2015-02-24 08:12:36

JQuery的動畫屬性可以在方法的單一調用棧對方（用逗號隔開）象下面這樣：

jQuery('.leftdiv').stop().animate({ 
    left: '-90%', 
    width : '80%' 
}); 

jQuery('.rightdiv').stop().animate({ 
    right: '-90%', 
    width : '80%' 
});

來源

2015-02-24 09:41:03

jQuery（'。leftdiv'）。stop（）。animate（{0} {0} {0}};}};; jQuery（'。rightdiv'）。stop（）。animate（{0}）;}};}};}};}};}}; – 2015-02-24 09:43:32

哦對不起，我現在正在糾正這個問題。 – 2015-02-24 09:45:05

jquery：滑動兩個div與放大/縮小效果

回答

相關問題