JQuery Fade Ticker Neat and Tidy答案

【问题标题】：JQuery Fade Ticker Neat and TidyJQuery Fade Ticker Neat and Tidy
【发布时间】：2011-03-24 14:31:16
【问题描述】：

尝试使用我自己的股票代码并用完 JQuery 知识。元素应该淡出然后下一个淡入。此时第一个元素淡出，而第二个和第三个元素一起淡入并且它们没有循环。显然我错过了一些东西。

<script type="text/javascript">
var elem1 = $('#fader').children();
    $(elem1).hide();
    $(elem1).first().fadeIn(2000,function(){
        $(elem1).delay(4000);

        $(elem1).fadeOut(2000, function(){
            $(elem1).next().fadeIn(2000);

            });
            }); </script>

有什么想法吗？

太棒了

【问题讨论】：

标签： jquery ticker

【解决方案1】：

好吧，我做了一个简单的修补程序，可以滚动所有值并停止。也许这就是您正在寻找的东西，或者至少可以帮助您建立自己的东西。 ;) 这是它的 HTML 代码：

<div id="fader" style="width:100px; height:100px; background-color:blue;">
    <p>aaaaaaaaaaaa</p>
    <p>bbbbbbbbbbbb</p>
    <p>cccccccccccc</p>
    <p style="display:none;">dddddddddddd</p>
    <p style="display:none;">eeeeeeeeeeee</p>
    <p style="display:none;">ffffffffffff</p>
    <p style="display:none;">gggggggggggg</p>
</div>

脚本本身：

<script type="text/javascript">
$(document).ready(function()
{
    var timer = window.setInterval(function()
    {
        var elem1 = $('#fader').children(':visible:first');
        var elem2 = $('#fader').children(':visible:last');

        if( !$(elem2).next().is(':last') )
            clearInterval( timer );
        else
        {
            $(elem1).fadeOut(1500, function()
            {
                $(elem2).next().fadeIn(1500);
            });
        }
    }, 3000);
});
</script>

祝你好运！ ;D

【讨论】：

【解决方案2】：

我认为这是您的选择器。 $(elem1) 指的是$('#fader') 的所有孩子，因此$(elem1).next() 最终会指代所有可能的“下一个”，在这种情况下，第一个和第二个元素有“下一个”，是第二个和第三个元素。

您想要做的是以某种方式跟踪当前显示的元素是哪个元素，然后在其时间淡出该元素并淡入该元素的下一个元素。

【讨论】：