title: Swiper events are not triggered
body: <p>I'm working on a gallery website which uses the Swiper 
  JQuery plugin for slideshows and isotope for grid. 
  Each item in the gallery has its own slider and its own 
  isotope item. The Swiper gallery pops up in a fancybox 
  and works only on resize.</p>
  
  <p>Can anyone tell me what I'm doing wrong? </p>
  
  <pre><code>&lt;script src='js/jquery.min.js'&gt;&lt;/script&gt;
      &lt;script src='js/fancybox.js'&gt;&lt;/script&gt;
      &lt;script src='js/bootstrap.min.js'&gt;&lt;/script&gt;
      &lt;script src='js/isotope.pkgd.js'&gt;&lt;/script&gt;
      &lt;script src='js/swiper.min.js'&gt;&lt;/script&gt;
      &lt;script&gt;
  
          var sliders = [];
          $('.swiper-container').each(function (index, element) {
              $(this).addClass('s' + index);
              var slider = new Swiper('.s' + index, {
                  pagination: '.swiper-pagination',
                  paginationClickable: true,
                  nextButton: '.swiper-button-next',
                  prevButton: '.swiper-button-prev',
                  spaceBetween: 0,
                  speed: 1000,
                  autoplay: 4000,
                  loop: true,
                  paginationBulletRender: function (swiper, index, className) {
                  return '&lt;span class="' + className + '"&gt;' + (index + 1) + '&lt;/span&gt;';
                  }
              });
              sliders.push(slider);
              slider.on('slideChangeStart', function () {
                  console.log('slide change start 2');
                  $('.overlay1').hide().delay(700).fadeIn(1400);
                  $('.overlay2').hide().delay(700).fadeIn(1400);
              });
          });
      &lt;/script&gt;
      &lt;script&gt;
          $( document ).ready(function() {
              $(".fancybox").fancybox({
                  maxWidth: 1170,
                  maxHeight: 682,
                  fitToView : false,
                  autoSize : false,
                  width: '100%',
                  height: '100%',
                  closeClick: false,
                  openEffect: 'fade',
                  closeEffect: 'fade'
              });
              $('.delete').click(
                  function () {
                  $('input:text').val('').trigger('keyup');
              });
          });
      &lt;/script&gt;
      &lt;script&gt;
          $('#navbar &gt; ul &gt; li').hover(function () {
             $(this).css("background-color", "#f3f3f3");
          }, function () {
             $(this).css("background-color", "transparent");
          });
         $('.delete').click(
             function () {
             $('input:text').val('').trigger('keyup');
         });
      &lt;/script&gt;
      &lt;script src='js/script.js'&gt;&lt;/script&gt;
  </code></pre>