2015-11-19 104 views
0

嗨,我使用magnific彈出圖像庫,當圖像放大時我想隱藏div並在圖像縮小時再次顯示。這是我的代碼:當magnific popup開啓時隱藏div

$('.gallery-item').magnificPopup({ 
     type: 'image', 
     gallery:{ 
      enabled:true 
     }, 
     mainClass: 'mfp-with-zoom', // this class is for CSS animation below 

     zoom: { 
     enabled: true, // By default it's false, so don't forget to enable it 

     duration: 300, // duration of the effect, in milliseconds 
     easing: 'ease-in-out', 


     // CSS transition easing function 

     // The "opener" function should return the element from which popup will be zoomed in 
     // and to which popup will be scaled down 
     // By defailt it looks for an image tag: 
     opener: function(openerElement) { 
      // openerElement is the element on which popup was initialized, in this case its <a> tag 
     // you don't need to add "opener" option if this code matches your needs, it's defailt one. 
     return openerElement.is('img') ? openerElement : openerElement.find('img'); 
     } 
     } 

}); 

我應該在哪裏放置隱藏()和show()函數,使他們將被觸發同時與莊重彈出。

+0

在CSS中沒有隱藏的值顯示。請發佈您的完整代碼或提供演示。 – Alex

回答

0

在打開的函數中使用此$(".main").hide();

+0

打開關閉功能實際上不工作,我再次編輯代碼。 –

0

不要使用CSS,因爲jQuery內置了用於顯示和隱藏元素的函數。

open: function(){ 
    $(".main").hide(); 
}, 
    close: function(){ 
    $(".hidden-div").show(); 
} 
+0

此功能不起作用,我編輯描述。你能幫我嗎我該如何做這件事? –

+0

看起來好像沒有辦法捕捉縮放事件。 – JB06