0

我在 foreach 循环中使用 jquery$("#" + theidoftheelement).animate(...)来为一个元素设置动画，但只有最后一个动画有效……请帮忙！

编辑：更多代码：（txt是文件中的小文本）

 txt.forEach(function (lcb) {
                    lcb = lcb.split("   ", 30);

                    var header = document.createElement('h3');
                    header.id = 'Infralist_' + lcb[2];
                    header.className = 'Infraa';
                    header.textContent = lcb[2];
                    document.getElementById("MainContent_Infralist").appendChild(header);

                    $('#' + lcb[2]).animate({ opacity: "1" }, 500);

                window.scrollTo(0, document.body.offsetWidth);
                initlist(runstr);};`
4

2 回答 2

0

setTimeout每次迭代都使用 like 来运行动画循环。

代码：

$("#animator").click(function () {
    $('.demo').each(function (index) {
        var self = this
        setTimeout(function () {
            $(self).animate({
                opacity: 0.25,
                left: "+=50",
                height: "toggle"
            });
        }, index * 500);
    });
});

演示：http: //jsfiddle.net/IrvinDominin/XFJXd/

于 2013-09-13T20:31:57.743 回答
0

现在工作：

var runningvar =-1;
var interval = setInterval(function () {
                    ++runningvar;
                    if (runningvar >= txt.length) {
                        interval = null;
                    }
                    var lcb = txt[runningvar];
                    lcb = lcb.split("   ", 30);

                    var header = document.createElement('h3');
                    header.id = 'Infralist_' + lcb[2];
                    header.className = 'Infraa';
                    header.textContent = lcb[2];
                    document.getElementById("MainContent_Infralist").appendChild(header);

                   document.getElementById("Infralist_" + lcb[2]).style.visibility = "visible";
                    document.getElementById("Infralist_" + lcb[2]).style.opacity = "1";
                    $('#' + "Infralist_" + lcb[2])

                        .hide()
                        .fadeIn(500, function () { });

                    ///////
                }, 500);

Jquery 似乎无法覆盖 css 属性，所以我将所有设置为可见，然后用 jquery 再次隐藏它 - 然后将其淡入（我添加了一个间隔）

编辑：实际上这不起作用，它们都被显示了，但又只是最后一个动画，但现在它起作用了：我用这个替换$('#' + "Infralist_" + lcb[2])了这个$(document.getElementById("Infralist_" + lcb[2]))

于 2013-09-14T20:36:46.457 回答