Кто-нибудь знает подсказку JQuery, которая включает решение для мобильных устройств? Поскольку состояние Hover не работает, я предполагаю, что мне нужно что-то, что также работает по щелчку. Может, при нажатии ведет себя как модальное окно? Просто выбрасываю сюда вещи. Не уверен, что будет лучшим решением.

- Обновление -

Мне очень нравится решение, предложенное @Alveoli, но в конечном итоге я сам его попробовал. Я использовал qTip в качестве основы и написал код Франкенштейна для создания всплывающих подсказок, удобных для сенсорного ввода, и модальных окон, удобных для мобильных устройств. Любая помощь в оптимизации кода будет принята с благодарностью. Вот скрипка ... http://jsfiddle.net/cssguru/NQRBT/

13
Adam Youngers 26 Авг 2011 в 04:24

3 ответа

Лучший ответ

Я ищу то же самое и нашел это элегантное решение:

http://osvaldas.info/blog/elegant-css-and-jquery-tooltip-responsive-mobile-friendly

Бонус в том, что на мобильном телефоне он «залипает», когда вы касаетесь его, и исчезает, когда вы касаетесь его снова.

17
Alveoli 13 Май 2012 в 09:37

Вы можете использовать jQuery UI Tooltip и убедиться, что всплывающая подсказка закрывается при любом прикосновении к странице, как показано ниже. :

initTooltip = function ($el) {
    var closeTooltipOnClick = function (e) {

        // This code if for touch devices only.
        // We want to tooltip to close, when we touch
        // anywhere on the page, except if we touch on
        // the link itself.

        if ($(e.target).closest($el).size()) {
            // We just clicked on the link, so let's
            // not close the tooltip.
            return;
        }

        $('body').off('touchend', closeTooltipOnClick);
        $el.tooltip('close');
    };

    $el.tooltip({
        open: function () {

            if (!Modernizr.touchevents) {
                return;
            }
            // We make sure that the tootlip closes on
            // touch devices if there is a touch event anywhere.
            $('body').on('touchend', closeTooltipOnClick);
        }
    });
};
5
Pierre Spring 18 Авг 2014 в 11:18

Раньше я пробовал приложение, и его всплывающие подсказки загружаются лениво. Например, в пользовательском интерфейсе отображается кнопка «Отправить», а затем через 3 секунды метка «Отправить ваши данные на сервер» отображается в виде всплывающей подсказки под кнопкой «Отправить».

Учитывая, что новым пользователям всегда нужно больше времени для выполнения действий, я думаю, что это хороший способ реализовать всплывающую подсказку. Старшие пользователи не будут беспокоиться, в то время как новые пользователи смогут увидеть всплывающую подсказку через некоторое время.

0
user900202user900202 26 Авг 2011 в 02:26