0

我正在尝试获得一个基本的循环和交叉淡入淡出的 jquery 函数,以便在 Joomla 3 中的顺序 DIV 层上工作。我读到的所有内容似乎都没有说明我做错了什么。这是 div HTML:

<div class="quotes">
<p><i>"Quote 1 with many lines of text"
<br>
Blessings,</i></p>
<p><b><i>Sherry</i></b>
</div>

<div class="quotes">
<p><i>
"Quote 2 with many lines of text"
<br>
Take care my friend,</i></p>
<p><b><i>Liz</i></b>
</div>

这是jQuery:

(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;}

我能够让代码在 jsfiddle 中工作,但不是我的 Joomla 3 网站。你可以在这里看到它的功能:http: //jsfiddle.net/n4mKw/4290/

请指导我如何使其在 Joomla 3 中发挥作用。提前致谢!

4

0 回答 0