使用jQuery捕捉列表

我的JavaScript目前还没有达到要求，我很难过！使用jQuery捕捉列表

我需要创建一个像这样的JavaScript的动画列表 - http://www.fiveminuteargument.com/blog/scrolling-list。

我要的是采取一个列表，像这样

<ul> 
    <li>Item 1</li> 
    <li>Item 2</li> 
    <li>Item 3</li> 
    <li>Item 4</li> 
    <li>Item 5</li> 
    <li>Item 6</li> 
</ul>

并显示两个在一次，然后在一个循环中，2同时显示出来。

即使伪代码也会帮助我开始。

来源

2010-02-28 Chris

这有什么错在你给的链接提供的信息？ – Dancrumb 2010-03-02 18:12:50

缺少一个步骤 - 它没有解释如何从上面的列表转到它描述的效果。我的JavaScript不够好，无法添加/删除元素。 – Chris 2010-03-03 03:18:07

嗨克里斯。我是该教程的作者。这是我的目标，几乎拼出每一步，所以我很抱歉，如果有什么缺失。该代码可以在文章的最下方下载，我建议这是您开始的最佳场所。如果您有任何具体问题，我很乐意回答 - 理想情况下，通过位于我的网站“联系人”链接后面的电子邮件地址。 – 2010-03-03 10:03:23

使用包含在消息中的html，可以运行以下命令。

$(document).ready(function(){ 
    //hide all the list items 
    $("ul li").hide(); 
    //call the function initially 
    show_list_item(); 
}); 

function show_list_item(){ 
    //fade in the first hidden item. When done, run the following function 
    $("ul li:hidden").first().fadeIn("slow", function(){ 
     //if there are no more hidden list items (all were shown), hide them all 
     if($("ul li:hidden").length == 0){ 
      $("ul li").hide(); 
     } 
     //call this function again - this will run in a continuous loop 
     show_list_item(); 
    }); 
}

来源

2010-02-28 23:38:03

谢谢yuval - 我运行时得到$（“ul li：hidden”）不是函数错误。我使用1.3.2，但不知道为什么。 – Chris 2010-03-01 00:23:01

你包含jQuery吗？这是当你得到美元符号的非函数时想到的第一件事。你还有其他的JS库吗？尝试在只包含jquery的页面中测试这个代码，以及包含的html代码。它应该在1.3.2没有问题的情况下工作。还要确保你用'

只需修改尤瓦的代码，以获得“每次两个行为工作：

$(document).ready(function(){ 
    //hide all the list items 
    $("ul li").hide(); 
    //call the function initially 
    show_list_item(); 
}); 

function show_list_item(){ 
    //fade in the first hidden item. When done, run the following function 
    $("ul li:hidden:first").fadeIn("slow", function(){ 
     //if there are no more hidden list items (all were shown), hide them all 
     if($("ul li:hidden").length == 0){ 
     $("ul li").hide(); 
     } 
    }); 
    $("ul li:hidden:first").fadeIn("slow", function(){ 
     //if there are no more hidden list items (all were shown), hide them all 
     if($("ul li:hidden").length == 0){ 
     $("ul li").hide(); 
     } 
     //call this function again - this will run in a continuous loop 
     show_list_item(); 
    }); 
}

来源

2010-03-01 16:00:33 DaveS

使用jQuery捕捉列表

回答

相关问题