jquery同時在兩個單獨的div中移動內容

Question

我在jsFiddle上工作以獲得兩個div來加載內容，並且基於選擇觸發器來激活targetID並向上滑入容器div。

因此，我需要將內容向左上滑動，並將圖像內容向右滑動。

我有內容div工作，但是當第二個函數觸發圖像div，它填充在左側的內容div，而不是右側的圖像div。

任何jsFiddler的幫助表示讚賞。 http://jsfiddle.net/3e5wb/6/

$('#drop').on('change', function() { 
moveUpContent($("#container"), $("#content"+this.value), 1000); 
moveUpImage($("#imgContainer"), $("#image"+this.value), 1000);   


}); 

function moveUpContent(container, object, speed) { 
    var speed = 500 || speed; 
    $(".content").fadeOut('slow'); 
    object.show(); 
    container.css("position", "relative"); 
    object.css("position", "absolute"); 
    object.css("top", container.height() + "px"); 
    object.css("opacity", "0"); 
    object.animate({ 
     top: 42, 
     opacity: 1 
    }, speed); 
} 

function moveUpImage(container2, object2, speed2) { 
    var speed2 = 500 || speed2; 
    $(".imgMain").fadeOut('slow'); 
    object2.show(); 
    container2.css("position", "relative"); 
    object2.css("position", "absolute"); 
    object2.css("top", container2.height() + "px"); 
    object2.css("opacity", "0"); 

    object2.animate({ 
     top: 42, 
    opacity: 1 
    }, speed2); 
} 

在此先感謝！

Answer 1

你的問題是圖像並沒有真正插入到正確的父元素中。這條線：

object2.show(); 

應該改成這樣：

object2.show().appendTo("#imgContainer"); 

然後它在正確的元素和顯示的權利。 更新提琴：http://jsfiddle.net/3e5wb/7/

希望這會有所幫助。

編輯：作爲另一個輕微的問題，圖像的位置是錯誤的。在第二個函數，此：

top: 42, 

應更新：

top: 0, 

到它與容器位置線。

編輯號碼2：繼評論之後，我再次更新了小提琴（http://jsfiddle.net/3e5wb/13/），爲第一個功能添加了appendTo - 僅僅爲了技術的正確性。