@alex5792
front man

Как открыть лайтбокс на мобильном устройстве?

Здравствуйте. Есть сайт www.ostin.tattoo . При нажатии на картинку в галерее открывается лайтбокс с ней. На мобильном устройстве этого не происходит. Как сделать чтобы при нажатии он открывался и на мобильном устройстве. Что уже не перепробовал, перерыл все функции темы. Плагины не предлагать. Заранее благодарен за вашу помощь ))
  • Вопрос задан
  • 269 просмотров
Решения вопроса 1
Bobert88
@Bobert88
Vice President of Javascript, very important guy.
Привет, посмотрел в custom.js файле и в функции pixflow_portfolioPopup проверяется, что ширина экрана не менее 1024 пикселей, прежде чем открывать попап.

Чтобы попап заработал на мобильном, нужно поправить функцию вот так:

function pixflow_portfolioPopup() {
    'use strict';

    $('body').on('click',".inside .item-wrap.portfolio-popup",function(e){
        var element= e.target || e.srcElement;
        if ((e.which != 2) ) { // <-- убрал проверку ширины экрана здесь.
            if (element.attributes.class.nodeValue.indexOf('icon') < 0) {
                $.magnificPopup.open({
                    items: {
                        src: $(this).find(".item-image").attr('data-src')
                    },
                    overflowY:'scroll',
                    type: 'image',
                    closeOnContentClick: false,
                    closeBtnInside: false,
                    mainClass: 'mfp-with-zoom mfp-img-mobile',
                    callbacks: {
                        beforeOpen: function () {
                        },
                        afterClose: function () {
                            $("html").css({'overflow-y': 'auto'});
                        },
                    }
                }, 0);
            }
        }
    });
    $('body').on('click', ".outside .item-image.portfolio-popup", function () {
         //убрал проверку ширины экрана здесь.
            $.magnificPopup.open({
                items: {
                    src: $(this).attr('data-src')
                },
                overflowY:'scroll',
                type: 'image',
                closeOnContentClick: false,
                closeBtnInside: false,
                mainClass: 'mfp-with-zoom mfp-img-mobile',
                callbacks: {
                    beforeOpen: function () {
                    },
                    afterClose: function () {
                        $("html").css({'overflow-y': 'auto'});
                    },
                }
            }, 0);
    });
}


К сожалению, в самом вордпрессе не силен, так что куда конкретно идти, чтобы поправить этот код, подсказать не могу.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы