title: Need to refresh page when using iDangero.us Swiper with jQuery Mobile
body: <p>I'm currently trying to add iDangerous Swiper to a page built with jQuery Mobile but in order to display the swiper I need to reload the page. I have seen a few instances where people have had some issues with these but their solutions have not work for my issue below. </p>
  
  <p>I have tried several different things: pageshow, pageinit, pagebeforeshow, mobileinit. Also trigger("create"), trigger("refresh") and have tried adding the script before or after jQuery Mobile js. </p>
  
  <p>I'm currently using jQuery Mobile 1.4.1 alpha 2 and Swiper 2.1.0.</p>
  
  <p>My question: What would be the proper sequence for the scripts in order to make it work and which one of the page event above should do the trick? Thanks for your time.</p>
  
  <p>My HTML for the swiper goes as follows:</p>
  
  <pre><code>&lt;div class="swiper-container"&gt;
          &lt;div class="swiper-wrapper"&gt;
  
          &lt;div class="swiper-slide"&gt;
  &lt;div class="picture"&gt;&lt;img src="image1.jpg" alt="Women's L-Premise Jacket" title=" Women's L-Premise Jacket "  id="productImage" /&gt;&lt;/div&gt;
          &lt;/div&gt;
  &lt;div class="swiper-slide"&gt;&lt;div class="picture"&gt;
        &lt;img src="image2.jpj" alt="Women's L-Premise Jacket" title=" Women's L-Premise Jacket " /&gt;
        &lt;/div&gt;&lt;/div&gt;
  &lt;div class="swiper-slide"&gt;&lt;div class="picture"&gt;
        &lt;img src="image3.jpg" alt="Women's L-Premise Jacket" title=" Women's L-Premise Jacket " /&gt;
        &lt;/div&gt;&lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>My jQuery and jQuery Mobile files are loaded at the bottom of the page.</p>
  
  <pre><code>    &lt;script type="text/javascript" src="includes/templates/YOUR_TEMPLATE_mobile/jscript/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script&gt;
      $(document).on('pagecreate', function(){
          $( "#leftPanel" ).trigger( "updatelayout" );
  
          $.mobile.defaultDialogTransition = 'slide';
          $.mobile.defaultPageTransition = 'slide';
          $.mobile.selectmenu.prototype.options.nativeMenu = false;
  
      });
  &lt;/script&gt;
  
  &lt;script src="/4.0/includes/templates/YOUR_TEMPLATE_mobile/jscript/idangerous.swiper-2.1.min.js"&gt;&lt;/script&gt;
  
  
  &lt;script type="text/javascript" src="includes/templates/YOUR_TEMPLATE_mobile/jscript/jquery.mobile-1.4.0-alpha.2.min.js"&gt;&lt;/script&gt;
  
  &lt;script src="/4.0/includes/templates/YOUR_TEMPLATE_mobile/jscript/boilerplate/helper.js"&gt;&lt;/script&gt;
  &lt;script&gt;
  $('#productinfo').on('pageshow', function() {
    var mySwiper = new Swiper('.swiper-container',{
      centeredSlides: true,
      slidesPerView: 2,
      watchActiveIndex: true
    });
  });
  &lt;/script&gt;
  </code></pre>