title: Random image Grid Issues
body: <p>I have created an image grid (using bootstrap mostly) and within that grid are 3 rows of 5 images. I would like them to ONE AT A TIME load randomly but not repeat until all the images have been used. I have an array of 32 images at this time.</p>
  
  <p>I've created a reduced test case with my current code (<a href="http://codepen.io/msbtterswrth/pen/MyZXZQ?editors=0010" rel="nofollow">http://codepen.io/msbtterswrth/pen/MyZXZQ?editors=0010</a>) which is ALMOST there with a few caveats. You'll notice after it fires they all go to the same image (not sure why), but if you change the following lines it works but repeats frequently.</p>
  
  <p><strong>change this</strong></p>
  
  <pre><code>var random_no = Math.floor(Math.random()*total_images)+1
  </code></pre>
  
  <p><strong>to</strong></p>
  
  <pre><code>var random_no = Math.floor(Math.random()*32)+1
  </code></pre>
  
  <p>I'm not terribly good at javascript/jquery and have spent the last two days trying all sorts of things i've come across, but this  is the closest solution I've been able to accomplish.</p>
  
  <p>EDIT: I gave up. Am now using this and some js do position the title over it.  <a href="http://tympanus.net/Development/AnimatedResponsiveImageGrid/index2.html" rel="nofollow">http://tympanus.net/Development/AnimatedResponsiveImageGrid/index2.html</a></p>
  
  <p>Still interested in an answer though, for future ref. </p>