如何使用nextbutton和prevbutton点击移动oneitem是左右jquery我想要幻灯片项目..如何使用jquery

Question

我想要nextbutton click rightlide oneitem和prevbutton click leftslid onitem如何使用jquery .... 请帮帮我......我累了......

<div class="items">
    <div class="item">1</div>
    <div class="item">2</div>
    <div class="item">3</div>
    <div class="item">4</div>
    <div class="item">5</div>
    <div class="item">6</div>
    <div class="item">7</div>
    <div class="item">8</div>
</div>
<div class="nextbutton">Next</div>
<div class="prevbutton">Prev</div>

// jquery的

 $(document).ready(function(){

    $(".prevbutton").click(function(){

        //how use one item
    });

    $(".nextbutton").click(function(){
        how use slide one item
    });

});

使用jfiddle

http://jsfiddle.net/kisspa/fj6z8/1/

Answer 1

      check this js fiddle

<强> http://jsfiddle.net/fj6z8/6/

            $(document).ready(function(){

                $(".prevbutton").click(function(){
                    $( ".items" ).scrollLeft( $( ".items" ).scrollLeft()-200 );
                    //how use one item
                });

                $(".nextbutton").click(function(){
                                $( ".items" ).scrollLeft( $( ".items" ).scrollLeft()+200 );
                });

        });

Answer 2

这里你想要的是什么：

$(".prevbutton").click(function(){
        $(".items").animate({scrollLeft: $( ".items" ).scrollLeft()-210},600);
});

$(".nextbutton").click(function(){
    $(".items").animate({scrollLeft: $( ".items" ).scrollLeft()+210},600);
});

fiddle