1

在此代码中：http://jsfiddle.net/GeAwB/，例如，我想使用 jquery show("slow") 为最后附加的内容设置动画。

我把新内容放在一些 div new_div 中：

<div id="new_div" ></div>

并将其添加到主 div“shanon”-div 中：

         <div id="shanon" style="height: 300px;"></div>

问题是，整个主 div“shanon”-div 将被动画化，我只希望最后添加的行被动画化。

任何的想法？

4

3 回答 3

2

试试这个...

http://jsfiddle.net/GeAwB/6/

你应该用一个元素包裹每一行，就像我的例子一样，我用一个包裹每一行 div

然后在你的 javascript.. 中找到最后一个 div 元素。然后动画它....

$("#shanon").append($("#new_div").html()).find("div").last().hide().show("slow");
于 2012-04-19T00:19:46.890 回答
1

这是另一种不会影响行距的可能性：http: //jsfiddle.net/GeAwB/18/

于 2012-04-19T00:25:00.627 回答
1

每次单击按钮时，创建一个新的 div 而不是尝试重用<div id="new_div"></div>

代码将大大简化并且变得更容易遵循

$(document).ready(function() {
    var $new_div, $shanon = $("#shanon"),
        $weiter = $("#weiter"),
        $zeile = $(".zeile");
    $weiter.removeAttr("disabled").click(function() {
        if (i < array.length) {
            if (i > 0) {
                $zeile.removeClass("zeile");
            }
            $new_div = $("<div/>").html(array[i]).hide().appendTo($shanon).show("slow");
            i = i + 1;
        }
        else {
            $zeile.removeClass("zeile");
            $weiter.attr("disabled", "disabled");

        }
    });
});

查看小提琴的更新

编辑：删除zeile类是不太正确的。$('.zeile')需要放回点击处理程序中。我不会费心进行更改，因为另一个答案已被接受，尽管效率低下。

于 2012-04-19T00:42:21.177 回答