title: Load content dynamically in bootstrap 2.3 modal
body: <p>I am doing some modifications with twitter bootstrap modal and I am trying to achieve dynamic image loading in modal window. Also when the certain image is loaded I would like to be able to swipe between images. Can anyone help me with this one?</p>
  
  <p>Here is structure:</p>
  
  <pre><code>&lt;!-- Image trigger --&gt;
  &lt;div class="item"&gt;
      &lt;a data-toggle="modal" href="#myModal" class="modal-trigger"&gt;
          &lt;img src="img/7.jpg" alt=""&gt;
       &lt;/a&gt;
  &lt;/div&gt;
  
  &lt;!-- Modal window --&gt;
  &lt;div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"&gt;
  
  &lt;!-- it makes empty spaces clickable --&gt;
  &lt;div type="button" class="close" data-dismiss="modal" aria-hidden="true"&gt;&amp;nbsp;&lt;/div&gt;
  
  &lt;img data-dismiss="modal" aria-hidden="true" src="http://placehold.it/800x670" class="image" alt="" data-target="#myModal"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>And here is javascript for swipe feature:</p>
  
  <pre><code>$(document).ready(function() {  
                      // Swipe feature
                       $("#myCarousel").swiperight(function() {  
                        $("#myCarousel").carousel('prev');  
                      });  
                       $("#myCarousel").swipeleft(function() {  
                        $("#myCarousel").carousel('next');  
                       });
  </code></pre>