Question

这就是我目前的做法：

function switchcontent(wait){
    //fade out image1
    $('#feature-img img:first-child, ').delay(wait).fadeOut('slow', function() {
        //fade in imag2
        $('#feature-img img:nth-child(2)').fadeIn('slow');
        var prev_img = ($(this).clone())
        $('#feature-img').append(prev_img);
        $(this).remove()
        switchcontent(wait);
    });
};

我对这个解决方案不是很满意，特别是因为我想把它应用到子元素的另一个元素上。

当前HTML：

<div class="images span7">
  <img src="featured_1.png">
  <img src="featured_2.png">
</div>

我想要的东西也适用于：

<div class="feature-text">
  <div>
    <h1>Lugn i din eknonomi</h1>
    <p>Zenconomy är smart fakturering, redovisning och rapportering på nätet. Vi underlättar vardagen för företagare, redovisningsbyråer och programmerare.</p>
  </div>
  <div>
    <h1>GRAPH</h1>
    <p>GRAPH OF APPROVAL!</p>
  </div>
</div>

或其中包含孩子的任何其他元素：）

Answer 1

请参阅http://jsbin.com/ufahiy/1/edit

$('div img:first').appendTo('div');

这会将第一个元素移动到div的最后一个元素

无需克隆和删除它：您要移动的元素的append()就足够了。您可以使用firebug检查DOM并查看更改

Answer 2

$('#feature-img').append(prev_img);
        $(this).remove()

您无需克隆它以追加。直接附加，它会被移动。

prev_img=$(this);
$('#feature-img').append(prv_img);

使用jquery将子元素移动到最后位置的最简洁方法？

2 个答案: