简单的代码 (jQuery)答案

【问题标题】：Simple Ticker (jQuery)简单的代码 (jQuery)
【发布时间】：2010-05-10 07:44:51
【问题描述】：

<ul>
    <li><a href="#">one</a></li>
    <li><a href="#">two</a></li>
    <li><a href="#">three</a></li>
</ul>

我想使用幻灯片效果一次只显示一个li，就是这样。我想避免在这样简单的事情上使用插件。

提前感谢您的帮助。

【问题讨论】：

我认为他正在使用rent-a-coder，并且正在为此获得报酬；）
我猜我已经不一样了。我问过很多类似的问题，而且总是得到帮助，但也许那些人已经离开了，而你已经到了？无论如何，谢谢，我自己想出了一个解决方案。
我的解决方案不是您想要的吗？如果不是，请评论我的答案，以便我调整代码。

标签： javascript jquery list slide ticker

【解决方案1】：

我为你做了一些简单的事情（根据你的描述），只是为了给你指明正确的方向：

在这里查看： http://jsfiddle.net/meo/ACenH/234/

function slider(container, delay){
$container = $(container) // select the container elements and store them in a variable

if ( !$container.length ){ return fasle; } // checks if the slider exists in your dom. if not the function ends here...

    var slides = $container.length, // gives back the total LI's you have
        slide = 0 // set the actual li to show

        setInterval(function(){ // set a Interval for your main function
            if (slide == slides - 1) { // if the actual slide is equal the total slides (-1 because eq is 0 based and length gives back the number of elements in the jQuery object) the slide counter is set to 0
               $container.slideDown(); // and all slides a shown again
               slide = 0;
            } else {
              $container.eq(slide).slideUp(); //slides the selected slide up i think you could think of a solution with .next() instead of eq() 
              slide++; // slide counter +1
            }

        }, delay)

}

slider('ul > li', 2000); // call your slider function

【讨论】：

【解决方案2】：

您的问题已经提到 jquery 作为首选的 javascript 框架。您可以开始的最佳位置是关于隐藏的 jquery 文档：

http://api.jquery.com/hide/

和滑动：

http://api.jquery.com/slideUp/
http://api.jquery.com/slideDown/
http://api.jquery.com/slideToggle/

【讨论】：