jQuery使用append with effects

Question

我怎样才能使用.append()像这样的效果show('slow')

有效果append似乎根本不起作用,它给出与正常情况相同的结果show().没有过渡,没有动画.

我怎样才能添加一个DIV到另一个,并且有一个slideDown或show('slow')效果上呢？

Answer 1

对附加产生影响是行不通的,因为浏览器显示的内容会在附加div后立即更新.那么,结合Mark B和Steerpike的答案:

在实际附加之前将您附加的div设置为隐藏样式.您可以使用内联或外部CSS脚本来执行此操作,或者只将div创建为

<div id="new_div" style="display: none;"> ... </div>

然后你可以将效果链接到你的追加(演示):

$('#new_div').appendTo('#original_div').show('slow');

或(演示):

var $new = $('#new_div');
$('#original_div').append($new);
$new.show('slow');

Answer 2

其实质是:

1. 你在父母身上叫'追加'
2. 但你想在新孩子身上打电话给'show'

这对我有用:

var new_item = $('<p>hello</p>').hide();
parent.append(new_item);
new_item.show('normal');

要么:

$('<p>hello</p>').hide().appendTo(parent).show('normal');

Answer 3

使用传入数据时的另一种方式(例如来自ajax调用):

var new_div = $(data).hide();
$('#old_div').append(new_div);
new_div.slideDown();

Answer 4

就像是:

$('#test').append('<div id="newdiv">Hello</div>').hide().show('slow');

该怎么办？

编辑:对不起,代码中的错误,并在船上也提到了马特的建议.

Answer 5

当你附加到div时,隐藏它并用参数显示它"slow".

$("#img_container").append(first_div).hide().show('slow');