Почему «содержимое не найдено» при загрузке большого всплывающего окна при загрузке страницы? - PullRequest
0 голосов
/ 19 декабря 2018

При открытии увеличенного всплывающего окна при загрузке я получаю полупрозрачное наложение, но текст внутри говорит: «Контент не найден» Почему это так?

В консоли элементы внутри # test-modal неактивны.

HTML

<div id="test-modal" class="mfp-hide subscribe__popup">
    <div class="subscribe--popup--wrapper">
       <p>Content here</p> 
    </div>
</div>

Javascript

$(document).ready(() => {
    setTimeout(() => {
        $.magnificPopup.open({
            items: {
                src: 'test-modal',
            },
            type: 'inline',
            preloader: true,
            modal: true,
        });
    }, 5000);
});

Ответы [ 2 ]

0 голосов
/ 19 декабря 2018

Вы должны изменить src: 'test-model' на src: '#test-model'.

Согласно увеличенной документации, текст должен быть

может быть строкой HTML, объектом jQuery или CSSселектор

0 голосов
/ 19 декабря 2018

Попробуйте с src: '#test-modal', или src: $('#test-modal'),, оба будут работать.

Примечание: в src это значение может быть HTML string, jQuery object, or CSS selector.

$(document).ready(() => {
    setTimeout(() => {
        $.magnificPopup.open({
            items: {
                src: $('#test-modal'),
            },
            type: 'inline',
            preloader: true,
            modal: true,
        });
    }, 5000);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/jquery.magnific-popup.min.js"></script>

<div id="test-modal" class="mfp-hide subscribe__popup">
    <div class="subscribe--popup--wrapper">
       <p>Content here</p> 
    </div>
</div>
...