1

私はshopifyサイトでカスタムの壮大なポップアップに取り組んでいます.私のheader.liquidファイルでは、壮大なポップアップコンテンツを呼び出しています.

<button id="open-popup" >Open popup</button>
<div id="my-popup" class="mfp-hide">
  popup  content here.
</div>

ここで、theme.js.liquidにスクリプトを追加しました 

$('#open-popup').magnificPopup({
  items: [
    {
      src: '#my-popup',
      type: 'inline'
    }
  ],
  gallery: {
    enabled: true
  },
  type: 'image'
});

しかし、次のエラーが表示されます

TypeError: $(...).magnificPopup is not a function

もし私がjsライブラリファイルのようなものが恋しいかどうか教えてください。

前もって感謝します。

4

3 に答える 3

0

magnificPopup コードが theme.js に含まれていても、同様の問題がありました。

理由は聞かないでください。magnificPopup 呼び出しを window.onload にラップした後、機能し始めました。

<script>
window.onload = function() {

  $('.open-popup').magnificPopup({
    type:'inline',
    midClick: true
  });
}

于 2019-10-23T07:32:38.170 に答える