我正在尝试获得一个基本的循环和交叉淡入淡出的 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 中发挥作用。提前致谢!