Question

所以基本上我有多个叫做引号的div类，它包含一个文本和一个blockquote。我怎样才能让它每隔5秒淡化到下一个引用类？

以下是标记的样子：

<div id="quoteWrapper">
<div class="quote">

    <blockquote>Quote goes here</blockquote>

    <p class="quoteBy">Author</p>

</div>

<div class="quote">

    <blockquote>Second Quote goes here</blockquote>

    <p class="quoteBy">Author</p>

</div>

<div class="quote">

    <blockquote>Third Quote goes here</blockquote>

    <p class="quoteBy">Author</p>

</div>
</div>

Answer 1

有一个类似的问题here。我要做的是创建一个间隔，使用jquery淡出当前引用并在回调中的下一个淡入淡出。您可以通过添加一个类来确定当前显示的报价

<div class="quote visible">

    <blockquote>Quote goes here</blockquote>

    <p class="quoteBy">Author</p>

</div>

<div class="quote">

    <blockquote>Second Quote goes here</blockquote>

    <p class="quoteBy">Author</p>

</div>

然后

setInterval(showQuote, 5000);

...

function showQuote() {
    // get visible quote
    $('.quote.visible').fadeOut(function() {
        // remove visible class from old quote and add it to new
        // get next quote and fadeIn() when fadeout finishes
    });
}

制作一个jQuery文本滑块

1 个答案: