Всплывающие изображения отображаются с полосой прокрутки в Magnific-Popup - PullRequest
Новая
       18

Всплывающие изображения отображаются с полосой прокрутки в Magnific-Popup

0 голосов
/ 19 октября 2019

Я использую Magnific-Popup, чтобы показать изображения галереи с iframe. Всплывающее окно работает, но изображения отображаются с полосой прокрутки.

Я попытался добавить ширину настройки класса в 100%, но не сработало. 

<script id="rendered-js">
    $('.modal').magnificPopup({
        type: 'iframe',


        gallery: {
            enabled: true, 

            preload: [0, 1], 

            navigateByImgClick: true,

            arrowMarkup: '<button title="%title%" type="button" class="mfp-arrow mfp-arrow-%dir%"></button>', // markup of an arrow button

            tPrev: 'Previous (Left arrow key)', 
            tNext: 'Next (Right arrow key)', 
            tCounter: '<span class="mfp-counter">%curr% of %total%</span>' 
        },

        iframe: {
            markup: '<div class="mfp-iframe-scaler">' +
                '<div class="mfp-close"></div>' +
                '<iframe class="mfp-iframe" frameborder="0" allowfullscreen></iframe>' +
                '<div class="mfp-title">Some caption</div>' +
                '</div>'

        },

        callbacks: {
            markupParse: function (template, values, item) {
                values.title = item.el.attr('title');
            }
        }
    });
    //# sourceURL=pen.js
</script>`

Нет сообщений об ошибках, только полоса прокрутки, которая появляется с каждым изображением.

1 Ответ

0 голосов
/ 19 октября 2019

Чтобы скрыть эту вертикальную полосу прокрутки (и горизонтальную полосу прокрутки, если она появляется тоже), вам нужно использовать свойство CSS overflow со значением hidden. 

.modal {
    overflow:hidden;
}
...