Содержимое Colorbox не прокручивается в мобильном сафари - PullRequest
Новая
       1

Содержимое Colorbox не прокручивается в мобильном сафари

4 голосов
/ 10 января 2011

Добрый вечер,
Я создал веб-сайт, использующий «толстую коробку», где он отображает календарь, и одна из возникших проблем заключается в том, что контент не будет прокручиваться в браузерах типа iPhone.Я попытался обновить его до colorbox и посмотреть, если это решило проблему, и это не так.

Как настроить мобильный браузер для прокрутки содержимого?

Вот страница, которую я использовал, чтобы попытаться выяснить проблему: http://hsr -bsa.org / test / test.php

Спасибо,
Майк

Ответы [ 4 ]

6 голосов
/ 27 марта 2013

Благодаря Джеку Муру файл colorbox css был обновлен, чтобы решить эту проблему: 

#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}

Поправка таблицы стилей с помощью правила переполнения, характерного для webkit, должна помочь.Нет необходимости обновлять любую функцию JavaScript.

Источник: https://github.com/jackmoore/colorbox/commit/ca4e63c71cf1ec00fb3340f2e1a0a5512cbc8f0a

0 голосов
/ 22 сентября 2017

Это хорошо работает для меня 

<script>
    var devicetype = '<?php echo $devicetype; ?>';// get ur divice type variable
    if(devicetype == 'mobile'){
        setTimeout(function () {
            var startY = 0;
            var startX = 0;
            var b = document.body;
            b.addEventListener('touchstart', function (event) {
                startY = event.targetTouches[0].screenY;
                startX = event.targetTouches[0].screenX;
            });
            b.addEventListener('touchmove', function (event) {
                event.preventDefault();
                var posy = event.targetTouches[0].screenY;
                var h = parent.document.getElementById("cboxLoadedContent");
                var sty = h.scrollTop;

                var posx = event.targetTouches[0].screenX;
                var stx = h.scrollLeft;
                h.scrollTop = sty - (posy - startY);
                h.scrollLeft = stx - (posx - startX);
                startY = posy;
                startX = posx;
            });
        }, 1000);
    }
    </script>
0 голосов
/ 10 июля 2012

Если кто-нибудь ответит на этот вопрос, см. мой ответ по этому вопросу в другой ветке.Обратите внимание, что вам нужно контролировать содержимое iframe, т.е. в том же домене.

0 голосов
/ 01 февраля 2011

Это ограничение мобильной версии Webkit.

Эта страница утверждает, что вы можете обойти ее, прокручивая двумя пальцами в пределах областей с переполнением: набор прокрутки.Я не был в состоянии испытать это для себя, хотя, поскольку мне не удалось заполучить Ipad компании, чтобы проверить это.

...