title: Lightbox - multiple images
body: <p>I'm using <a href="https://github.com/jbutz/bootstrap-lightbox" rel="nofollow">bootstrap-lightbox</a> in order to show up certain images in a page.</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;a href="#lightbox" class="thumbnail"&gt;
    &lt;img src="/img/img1_thumb.png" /&gt;
  &lt;/a&gt;
  &lt;a href="#lightbox" class="thumbnail"&gt;
    &lt;img src="/img/img2_thumb.png" /&gt;
  &lt;/a&gt;
  
  &lt;div id="lightbox" ...&gt;
    &lt;div class='lightbox-header'&gt;
      &lt;button type="button" class="close" ...&gt;&amp;times;&lt;/button&gt;
    &lt;/div&gt;
    &lt;div class='lightbox-content'&gt;
      &lt;img src="/img/img1.png" /&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I simply need to show the full version of the thumbnail that is clicked.</p>
  
  <p>Is there a <code>lightbox</code> way to update the <code>lightbox-content</code>s <code>img</code> before opening the modal ?</p>
  
  <p>Or should I add something like:</p>
  
  <pre class="lang-js prettyprint-override"><code>$('.thumbnail').click(function () {
      $('#lightbox .lightbox-content img')
          .attr('src', $(this).attr('data-imagefull'));
  });
  </code></pre>
  
  <p>?</p>
  
  <hr>
  
  <p><strong>Update</strong></p>
  
  <p>I'm not trying to generate the full image path automatically.<br>
  I just don't know where to specify this full image path.</p>