jQuery appended（）配置

Question

私のウェブサイトからいくつかのアイムを削除してから追加しなければなりませんが、追加すると別の場所に表示されますが、同じ場所に正確に表示したい彼らが以前にあった場所。

これに修正がありますか？ここで

は（画像は最初の付加した後postionどのように変化するかに気づく）を更新すること自由に感じ、サンドボックスです：その特定のケースで

http://jsfiddle.net/Zt9tZ/1/

Answer 1

たぶん私はここに欠けているいくつかの追加情報がありますが、なぜそれを完全に削除しますか？ hideとshowを使用できない理由はありますか？

http://jsfiddle.net/Zt9tZ/10/

添付の問題点は、親への最後の一人としての要素を追加することです。何らかの理由で要素を完全に削除する必要がある場合は、その場所に何らかのプレースホルダを置くことができます。おそらくreplaceWithと、元の要素で後で再び置き換えられるいくつかの目に見えない要素で。

---

あるいは、最寄りの兄弟を追跡し、insertBeforeまたはinsertAfterを使用することができます。

EDIT：insertAfterの例：

var image = jQuery(".image"); 
var prev; 

jQuery("#remove").click(function(){ 
    prev = image.prev(); 
    image.remove(); 
}); 

jQuery("#append").click(function(){ 
    if(prev.length === 0){ 
     // element was first 
     jQuery("#container").prepend(image); 
    }else{ 
     image.insertAfter(prev); 
    } 
}) 

http://jsfiddle.net/Zt9tZ/12/

---

EDIT2：replaceWithの例：

var image = jQuery(".image"); 
var replacement = $("<div></div>"); 

jQuery("#remove").click(function(){ 
    image.replaceWith(replacement); 
}); 

jQuery("#append").click(function(){ 
    replacement.replaceWith(image); 
}) 

http://jsfiddle.net/Zt9tZ/13/

Answer 2

、あなたはでそれを戻すために、代わりに.prepend()を使用する必要があります選択された要素の末尾ではなく、開始点。

Answer 3

私は画像の絶対位置のCSSを行います。

CSS

.imageStatic 
{ 
    position:absolute; 
    left:20px; 
    top:45px; 
} 

Javascriptを

var image = jQuery(".imageStatic"); 

jQuery("#remove").click(function(){ 
    var image = jQuery(".imageStatic").remove(); 
}); 

jQuery("#append").click(function(){ 
    jQuery("#container").append(image); 
    $("#container img").addClass("imageStatic"); 
}) 

ワーキングサンプル：http://jsfiddle.net/Zt9tZ/9/

Answer 4

hide（）とshow（）を使用すると同じ効果が得られますが、要素はそのまま残ります。このような基本的

、：http://jsfiddle.net/4JQ9m/