title: Display or Cycle 3 divs at a time
body: <p>I have a section on my page that is to show 3 divs at a time, although there may be additional divs hidden.</p>
  
  <p>By clicking on a "more" button, the next 3 divs will fade in, and the previous ones will fade out. </p>
  
  <p>So if we have 6 divs, the first 3 are displayed, clicking on the More button, divs 4-6 will be displayed.</p>
  
  <p>If possible the 3 divs should be shown at all time.</p>
  
  <p>So for example if we have 5 divs, then when you click on the More button, divs 3-5 are displayed.</p>
  
  <p>I know there is a jquery plugin called jCarousel that can do this, but just wondering if it is possible without a plugin because I am building a responsive website and the  carousel plugin uses fixed size DIVs.</p>
  
  <p>EDIT:
  HTML:</p>
  
  <pre><code>&lt;a class="more" href="#"&gt;More&lt;/a&gt;
  
  &lt;div id="container"&gt;
      &lt;div class="item"&gt;&lt;div&gt;One&lt;/div&gt;&lt;div&gt;some more text&lt;/div&gt;&lt;/div&gt;
      &lt;div class="item"&gt;&lt;div&gt;Two&lt;/div&gt;&lt;div&gt;some more text&lt;/div&gt;&lt;/div&gt;
      &lt;div class="item"&gt;&lt;div&gt;Three&lt;/div&gt;&lt;div&gt;some more text&lt;/div&gt;&lt;/div&gt;
      &lt;div class="item"&gt;&lt;div&gt;Four&lt;/div&gt;&lt;div&gt;some more text&lt;/div&gt;&lt;/div&gt;
      &lt;div class="item"&gt;&lt;div&gt;Five&lt;/div&gt;&lt;div&gt;some more text&lt;/div&gt;&lt;/div&gt;
      &lt;div class="item"&gt;&lt;div&gt;Six&lt;/div&gt;&lt;div&gt;some more text&lt;/div&gt;&lt;/div&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p>Javascript:</p>
  
  <pre><code>$("#container .item").slice(0,3).show();
  
  $(".more").click(function(event) { 
    var $currElements = $("#container .item:visible");
    var $nextElements = $("#container .item:hidden");
  
  
      $currElements.hide();
      $nextElements.show();
  
      event.preventDefault();
  
  });
  </code></pre>
  
  <p>This is what I currently have: <a href="http://jsfiddle.net/Wnp5J/" rel="nofollow">http://jsfiddle.net/Wnp5J/</a></p>
  
  <p>Just wondering now if it is possible to cycle back to the first 3 items when you click on the button again.</p>
  
  <p>Also, if possible, to always display 3 items.</p>