javascript - 淡入/淡出 jquery 列表

标签 javascript jquery html css

我正在尝试编写一个循环遍历无序列表(具有 id“intro”的 ul 元素)并分别淡入和淡出每个元素的 jquery 函数。这不起作用,但我在开发人员工具中没有发现任何错误。我也尝试更改 var list = $("#intro");var list = $("#intro li");但也没有骰子

<script type = "text/javascript">
        function startAnimations(){

            var list = $("#intro");
            list.hide();
            list.each(function(li) {
                $(li).fadeIn(3000, function(){
                    $(li).fadeOut(3000);
                });

            });
        }
    </script>

由于要求提供 html:

<body onload="startAnimations()">
    <div class = "container">
        <div id = "inner">  </div>
        <div id = "right-col">
            <ul id = "intro">
                <li id = "greeting"> <h2 > sometext </h2> </li>
                <li id = "sidenote"> <h6 >  sometext </h6> </li>
                <li id = "sentence"> <h3 >  sometext </h3> </li>
                <li id = "sentence"> <h3 >  sometext</h3> </li>
                <li id = "sentence"> <h3 >  sometext</h3> </li>
            </ul>
        </div>
    </div>

</body>

最佳答案

尝试

function startAnimations() {
    $("#intro li").hide();

    function loop() {
        var $li = $("#intro li:first-child").fadeIn(3000, function () {
            $li.fadeOut(3000, function () {
                $li.appendTo('#intro');;
                loop()
            })
        });
    }
    loop()
}

演示:Fiddle

关于javascript - 淡入/淡出 jquery 列表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22703829/

相关文章:

javascript - Coldfusion 异步将表单发送到 cfc

javascript - TypeError : jQuery(. ..).find(...).carousel 不是函数

javascript - 删除全屏垂直滚动条?

JQuery验证: Fail if two fields both optional are filled out?

html - 我是否对 SVG 文件使用 <img>、<object> 或 <embed>?

javascript - ChartJS 图表不在选项卡内生成

javascript - Ng-src 不会在 AngularJS View 中更新

javascript - 将 Cell 渲染成特定元素?

javascript - 使用 HTML 进行 Visual Basic UI 设计

php - 从 PHP/SQLite 中的查询返回字符串