2017-02-15 8 views
0

このページでは、ライトボックス/モーダルウィンドウを作成しようとしています:WordPress(4.7.2; no-plugins enabled) Magnificポップアップ(V1.1.0)を使用していますディビテーマ私が代わりにライトボックス/ポップアップ作業、私が手のjsエラーのイメージのいずれかをクリックしてMagnificent Popup - WordPress Diviテーマ - 未知のタイプエラー:未定義のプロパティ 'トップ'を読み取ることができません

http://www.mucha-art.com/portfolio/

Uncaught TypeError: Cannot read property 'top' of undefined 
    at t._getOffset (jquery.magnific-popup.js:4) 
    at HTMLAnchorElement.<anonymous> (jquery.magnific-popup.js:4) 
    at HTMLAnchorElement.dispatch (jquery.js:3) 
    at HTMLAnchorElement.r.handle (jquery.js:3) 
    at Object.trigger (jquery.js:3) 
    at n.fn.init.triggerHandler (jquery.js:3) 
    at y (jquery.magnific-popup.js:4) 
    at t.open (jquery.magnific-popup.js:4) 
    at t._openClick (jquery.magnific-popup.js:4) 
    at HTMLAnchorElement.d (jquery.magnific-popup.js:4) 

...コンソールの722行目を指しているようです:

e.top -= a(window).scrollTop() - f; 

答えて

1

私はちょうどこれを自分自身に遭遇しました。それは拡大するはずの画像のトップを探しています。あなたのコードを見ることなく、私はあなたが画像をプリロードしていないと仮定します。

My Clientには、イメージがCSSを介して背景イメージとして配置されるイメージアセットがあります。 Magnificent Popupを階層で使用すると、それはそのままで動作します。そうでなければ、画像もロードする必要があります。

私のハックソリューションは、それが正しい位置になるようにズームアニメーションを開始するために同じ、完全なイメージをロードするイメージタグを追加し、それをなし、高さと幅を持たないと見えないクラスを与えることだった。

$(document).ready(function() { 

    $(".galerie-content").magnificPopup({ 
     delegate: 'a', 
     type: 'image',   
     closeOnContentClick: true, 
     closeBtnInside: false, 
     mainClass: 'mfp-no-margins mfp-with-zoom', 
     zoom: { 
      enabled: true, 
      duration: 200 
     } 
    }); 

}); 
.galerie-img-1 { 
    background-image: url("../img/galery/galery_01.jpg"); 
    background-repeat: none; 
    background-position: center; 
    background-size: cover; 
    opacity: 1; 
    height: 300px; 
} 

.invisible{ 
    height: 0px; 
    width: 0px; 
} 
<a href="./img/galery/galery_01.jpg"> 
    <div class="galerie-img-1"> 
     <div class="galerie-one-one col-12 col-6-m"> 
     <img src="./img/galery/galery_01.jpg" class="invisible"> 
     </div> 
    </div> 
</a> 
関連する問題