Jquery 为什么.fadeTo（）.each（）停止工作？

我的Wordpress网站有一个加载动画，当页面加载时隐藏内容，然后为任何具有“typewrite”类的元素逐项显示内容

至少在我创建这个网站的时候是这样，但在过去一两年中，它在某个时候停止了工作。我正在用Chrome浏览器查看它。看起来有些元素显示了很短一段时间，然后隐藏起来，然后按照它们应该的那样设置动画

您可以在下面的位置看到问题。主页、公文包和关于部分都有问题，并且都使用相同的动画脚本

谁能看到错误是什么，并解释为什么它现在的行为有所不同，尽管没有任何改变

jQuery('.typewrite').fadeTo(0, 0).each(function(index){
            var self = this;
            setTimeout(function () {
                jQuery(self).fadeTo(250, 1);
            }, index * 100);
});

我建议：

jQuery('.typewrite').css('opacity', 0).each(function(index, element){
    jQuery(element).delay(index * 100).fadeTo(250, 1);
});

---

这会将初始不透明度初始化为

0

，然后在每个

.typewrite

元素之间循环，并在开始短的

fade（）

之前设置一个可变的时间。问题是初始的

.fadeTo（）

调用。如果我没记错的话，像这样的黑客在jQuery的旧版本中很常见，因为对于隐藏/显示/动画相关的函数。问题是，如果初始属性设置在

样式

标记中或外部图纸中，则效果无法正常工作；您必须直接在元素的

style

属性上设置它们，而这个属性不太理想，因此很多时候，您可以通过调用要运行的函数将元素设置为初始状态，或者使用

.css（）

来设置它们

这个问题早就解决了，所以这里正确的更改是删除初始的

.fadeTo（）

，然后在CSS中设置元素的初始状态。大概您想同时执行

显示

和

不透明度

属性：

.typewrite {
    display: none;
    opacity: 0;
} 

然后，您修改的JS将是：

    jQuery('.typewrite').each(function(index){
        var self = this;
        setTimeout(function () {
            jQuery(self).fadeTo(250, 1);
        }, index * 100);
    });

---

我认为这些页面没有明显的问题。你能提供一些关于问题到底是什么的详细信息吗？

的要点是什么？fadeTo（0，0）

？@jfriend00，想想在某一点上，jQuery的动画和显示/隐藏函数有问题，如果元素有css规则影响

显示

和

不透明度

，但这早已解决了。也正是这个电话可能导致了这个问题。他应该尝试删除它，然后在CSS中设置

的初始道具。打字
（假定
显示：无；不透明度：0；
）。@Rory，如果我的帖子不清楚，我很抱歉。故障可以在“关于”页上最清楚地看到。当页面加载时，Wordpress帖子在进入动画之前不应可见。然而，有几篇文章显示了，然后隐藏并在中设置动画。@prodigitalson这解决了它，谢谢，但我无法将你的解决方案标记为正确的注释。我的CSS没有
.typewrite
的样式，所以我添加了
不透明度：0
，这立即解决了这个问题。当我后来重新阅读你的评论时，我意识到这是你的建议，而且我不再需要
.fadeTo（0,0）
。是的。更简单、更有效的答案。虽然为什么initial
js
在OP上做它正在做的事情
jQuery（'.typewrite'）.fadeTo（0，0）。每个
？@guest271314-我不知道OP的答案为什么不起作用。如果jQuery将
fadeTo（）
操作排入队列并实际执行异步动画，那么它可能与
.fadeTo（）
的初始化冲突。我消除了任何可能的歧义。如果有疑问，我会首先删除任何可能的异常。页面上的
$
未定义
，
jQuery（元素）
似乎会返回预期结果。@guest271314-从
$
更改为
jQuery
。您在没有定义
$
符号的情况下运行有什么原因吗？OP可能没有“看到”上面的第二句话，似乎是针对“他们”的？谢谢，这正是我所做的，它马上就起作用了。我不明白为什么它停止了工作，但你解释得很好，在这个过程中节省了我很多时间。非常感谢。