需要延长褪色时间

问题描述

HTML和Javascript编码的新手。寻找一点帮助。我有这段代码,但是当文本行更改为滚动文本时,它不会让整个行滚动,然后逐渐退回到第一行。

滚动文本行将定期更改,因此它需要能够在滚动完成后重新显示

这可能吗?请并感谢您的所有帮助!

HTML代码

<h2 class="quotes">Now Playing on Radio Wolf</h2>
<h2 class="quotes"><marquee width="60%" direction="left" height="100px">5 Seconds of Summer - Permanent Vacation</marquee></h2>

JS代码

(function() {

    var quotes = $(".quotes");
    var quoteIndex = -1;
    
    function showNextQuote() {
        ++quoteIndex;
        quotes.eq(quoteIndex % quotes.length)
            .fadeIn(2000)
            .delay(2000)
            .fadeOut(2000,showNextQuote);
    }
    
    showNextQuote();
    
})();

CSS代码

.quotes {display: none;}

解决方法

听起来fadeOut计时器设置得太低。

尝试将其设置为:

.fadeOut(5000)

让数据有更多的时间加载,并能够在数据淡出之前对其进行选择。