Избавьтесь от лупы в веб-приложении для iOS - PullRequest
11 голосов
/ 10 февраля 2012

В настоящее время я изучаю веб-приложения для устройств iOS и использую PhoneGap для создания из него «нативного» приложения. У меня проблема с лупой, которую я не хочу показывать при выборе абзацев (или небольшого количества текста). Я пробовал много решений, но ничего не работает. Я использую этот CSS, чтобы отключить все копии, выделения и тому подобное для тех полей, которые я не хочу:

*[untouchable] {
    -webkit-user-drag: none;
    -webkit-user-modify: none;
    -webkit-highlight: none;

    -webkit-touch-callout:  none;
    -webkit-user-select:    none;
    -khtml-user-select:     none;
    -moz-user-select:       none;
    -ms-user-select:        none;
    -o-user-select:         none;
    user-select:            none;
}

Это работает нормально, но при нажатии и удерживании текста все равно показывает лупу / лупу:

Touch + hold shows magnifier on text

Есть ли реальное решение для этого? Это было бы замечательно с простым свойством CSS, таким как -webkit-magnifier: none или что-то в этом роде. Если есть решение на JavaScript, это тоже хорошо, но, возможно, это излишество.

Так как я использую PhoneGap и он использует UIWebView для отображения страницы, возможно, есть способ отключить лупу для этого, но я не слишком много смотрел на собственный источник.

Заранее спасибо: -)

Ответы [ 2 ]

4 голосов
/ 10 февраля 2012

Единственный способ добиться этого - полностью избавить элементы от выделения, поскольку лупа включена.-webkit-user-select:none; следует применять ко всем элементам, где вы не хотите, чтобы лупа появлялась.

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

Это то, что я использовал

* {
        -webkit-touch-callout: none;
        -webkit-user-callout: none;
        -webkit-user-select: none;
        -webkit-user-drag: none;
        -webkit-user-modify: none;
        -webkit-highlight: none;
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...