为自定义图片库添加“下一步”和“后退”按钮

问题描述

|| 我有这个javascript代码：

$(function(){
    $(\'.words-gallery div:gt(0)\').hide();

    setInterval(function() {
        $(\'.words-gallery > div:first\')    
        .fadeOut(1000)    
        .next()
        .delay(995)
        .fadeIn(1000)    
        .end()    
        .appendTo(\'.words-gallery\');},3000);

});

此代码将从from1ѭ创建一个图库，而每个

3000

将隐藏当前的

DIV

并显示下一个。 我正在尝试添加“下一步”和“后退”按钮，但是它对我不起作用。 这是我的小提琴： http://www.jsfiddle.net/jUrNx 知道怎么做吗？     

解决方法

为什么不使用jQuery Cycle插件？它可以让您完成所有要求的工作，甚至更多。甚至有一个使用\“ next / prev \”的特定示例。 这是一个有效的小提琴：http://jsfiddle.net/3Qz5T/ 本质上，您将按照以下步骤设置代码： 的HTML

<div class=\"nav\"><a id=\"prev2\" href=\"#\">Prev</a> <a id=\"next2\" href=\"#\">Next</a></div>
<div class=\"words-gallery\">
    <div>1</div>
    <div>22</div>
    <div>333</div>
</div>

JS

$(\'.words-gallery\').cycle({ 
    fx:     \'fade\',speed:  \'fast\',timeout: 3000,next:   \'#next2\',prev:   \'#prev2\' 
});