Как заставить Magnific Popup работать с плагином Ajax Load More - PullRequest
Новая
       10

Как заставить Magnific Popup работать с плагином Ajax Load More

0 голосов
/ 15 ноября 2018

Я предполагаю, что причина, по которой Magnific Popup не будет работать с плагином Ajax Load More, поскольку он инициализирован в неправильное время.Итак, как мне заставить его работать с Ajax Load More?

Это то, что я хочу воссоздать https://connekthq.com/plugins/ajax-load-more/examples/advanced-custom-fields/gallery/ Я считаю, что эта демонстрация использует Magnific Popup, так как некоторые классы одинаковы истиль всплывающего окна выглядит так же, как Magnific.Но я не могу найти какую-либо документацию по этому вопросу.

Вот мой код:

js 

jQuery(document).ready(function(){
    $('.column').magnificPopup({
        delegate: 'a',
        type: 'image',
        tLoading: 'Loading image #%curr%...',
        mainClass: 'mfp-img-mobile',

        gallery: {
            enabled: true,
            navigateByImgClick: true,
            preload: [0,1] // Will preload 0 - before current, and 1 after the current image
        },

        image: {
            tError: '<a href="%url%">The image #%curr%</a> could not be loaded.',
            titleSrc: function(item) {
                return '<h4 class="lb-title">' + item.el.attr('title') + '</h4>' + '<p class="lb-description">' + item.el.attr('data-description') + '</p>';
            }
        }
    });
});

Шаблон повторителя в плагине Ajax Load More; 

<div class="column col-md-4">
    <a href="<?php echo $image['url']; ?>">
        <div class="gal_img" style="background-image: url(<?php echo $image['url']; ?>);"></div>
    </a>
</div>

Шорткод для плагина Ajax Load More; 

[ajax_load_more acf="true" acf_post_id="11" acf_field_type="gallery" acf_field_name="gallery_image" post_type="page" transition_container="false" images_loaded="true" button_label="Load More" button_loading_label="Loading" posts_per_page="3"]
...