Javascript 淡入和淡出文本 - 不同的时间

Question

我一直在使用此代码来淡入和淡出文本。我正在将其用于新闻自动收报机 但有时，某些标题会比其他标题长得多，并且需要更多时间让用户阅读。有没有办法为每个淡入淡出设置不同的时间？

 <script>
    var counter = 0;
    function changeText()
    {
    var quotes = new Array();
    quotes[0] = "quote1";
    quotes[1] = "quote2";
    quotes[2] = "quote3";
    quotes[3] = "quote4";
    quotes[4] = "quote5";
    if (counter > 4)
        {
        counter = 0;
        }
    document.getElementById("textslide").innerHTML = quotes[counter];
    setTimeout(function(){changeText()},1000);
    counter ++;
    }
    </script>

Answer 1

试试这个（小提琴）：

var counter = 0;
function changeText()
{
    // Use an array of objects so each quote can have it's own display duration
    var quotes = new Array();
    quotes[0] = { text: "quote1", time: 500 };
    quotes[1] = { text: "quote2", time: 500 };
    quotes[2] = { text: "quote3", time: 500 };
    quotes[3] = { text: "quote4", time: 500 };
    quotes[4] = { text: "much longer quote", time: 2000 };
    // get the current quote
    var quote = quotes[counter];
    document.getElementById("textslide").innerHTML = quote.text;
    setTimeout(function(){changeText()}, quote.time);
    counter ++;
    // You probably want to reset your counter here
    if (counter > 4) {
        counter = 0;
    }
}