2013-06-12 8 views
1

나는 여러 이미지의 갤러리가있는 웹 사이트를 만들고 있습니다. 이러한 이미지는 본질적으로 커버 역할을합니다. Magnific Popup을 사용하여 클릭하면 해당 항목 내에서만 슬라이드 쇼가 포함 된 라이트 박스를 엽니 다 (갤러리 항목 1, 갤러리 항목 2 등 ...) 이미 Swiper 플러그인을 사용하여 슬라이드 쇼를 설정하고 팝업 창에서이 슬라이드 쇼를 열고 싶습니다. 팝업에서 html 콘텐츠를 열 수는 있지만 전체 슬라이드 쇼가 포함 된 div는 어떻게 될까요? 논리적 인 것처럼 보이지만 작동시키지 못합니다.Magnificent Popup에는 슬라이더가 포함될 수 있습니까?

+0

이 몇 가지 코드 – user20232359723568423357842364

+0

확인 http://dimsemenov.com/plugins/royal-slider/slider-in-lightbox/ –

답변

0

방금 ​​Magnific Popup 내부에서 Flexslider로이 작업을 수행했습니다. 작동 시키려면 Magnific 콜백에서 Flexslider를 초기화해야했습니다.

$('.ajaxpop').magnificPopup({ 
    type: 'ajax', 
    callbacks: { 
     parseAjax: function(mfpResponse) { 
      mfpResponse.data = $(mfpResponse.data).find('#slider-container'); 
     }, 
     ajaxContentAdded: function() { 
      $('.flexslider').flexslider({ 
        animation: "slide" 
      }); 

     } 

    } 
}); 

사용하는 슬라이더에 관계없이 비슷한 프로세스입니다.

0
$('.open-popup-link').magnificPopup({ 
    type: 'ajax', 
    callbacks: { 
    parseAjax: function(mfpResponse) { 
    mfpResponse.data = $(mfpResponse.data).find('#sliderContainer'); 
    }, 
    ajaxContentAdded: function() { 
     $("#owl-demo").owlCarousel({ 

     navigation : true, 
     nav : true, // Show next and prev buttons 
     slideSpeed : 600, 
     paginationSpeed : 700, 
     singleItem:true, 


     // "singleItem:true" is a shortcut for: 
     items : 1, 
     // itemsDesktop : false, 
     // itemsDesktopSmall : false, 
     // itemsTablet: false, 
     // itemsMobile : false 

    }); 

    } 

} 

}); 
+0

이 붙여 넣기 Maginfic의 올빼미 회전 목마에 대한 스 니펫 라이트 상자의 슬라이더에서 영감을 얻은 팝업. – Rizwaan