Слайд/перемещение div с jquery

Question

Я довольно новичок в jquery и не нашел никакой помощи по следующей проблеме. Представьте себе этот HTML код:

<div id="slideLeft">Click here to slide left</div> 
<div id="main"> 
    <div id="div1">Content</div> 
    <div id="div2">Content</div> 
    <div id="div3">Content</div> 
    <div id="div4">Content</div> 
</div> 
<div id="slideRight">Click here to slide right</div> 

Каждый ДИВ имеет фиксированную высоту и ширину, но основной DIV должен показать только два Div с полуслова. Слева и справа от этого главного div есть кнопки или что угодно (в этом примере только другие div), которые сбрасывают содержимое div при нажатии.

По умолчанию мы увидим div1, div2. Когда я нажимаю «slide right», он должен перемещать div, чтобы мы могли видеть div2, div3 после скольжения. Etc и т. Д.

Я видел много примеров с ползунками (похожими на полосы прокрутки), но на самом деле это не то, что я ищу.

Спасибо за ваш вклад, я надеюсь, что мой вопрос достаточно ясен!

Answer 1

Я написал это некоторое время назад (и немного приспособил его для ваших нужд). Работа скрипки доступной здесь:

http://jsfiddle.net/ben1729/CtNsE/2/