Как добавить <a href ссылки во всплывающую подсказку и иметь возможность навести курсор мыши и щелкнуть по нему? для jQuery UI 1.10

Question

Как добавить <a href ссылки во всплывающую подсказку и иметь возможность навести курсор мыши и щелкнуть по нему? для jQuery UI 1.10

0

Я использую JQuery UI 1.10 Tooltip. Ниже мой призыв к подсказке. Я не могу найти в документации о том, как это сделать. Я хочу добавить ссылки href во всплывающую подсказку и дать пользователю возможность навести указатель мыши и щелкнуть по нему. Прямо сейчас, как только моя мышь отскакивает от спускового крючка, всплывающая подсказка исчезает.

    $(function () {
        $(document).tooltip({
            track: false,
            show: {
                effect: "slideDown",
                delay: 20
            },
            hide: {
                effect: "explode",
                delay: 5
            }
        });
    })

Документация: http://api.jqueryui.com/tooltip/#option-position

Благодаря,

Будет

user3108698 25 апр. 2014, в 22:09

Источник

Теги:

javascript

jquery

jquery-ui

1 ответ

Ещё вопросы

Ian A · Answer 1 · 2014-04-28T07-21-00.000Z

Всплывающие подсказки jQuery UI не поддерживают это из коробки, но вы можете добавить следующий код, который задерживает функцию hide, позволяющую перемещать мышь над всплывающей подсказкой:

close: function (event, ui) {
    ui.tooltip.hover(
        function () {
            $(this).stop(true).fadeIn(250);
        },    
        function () {
            $(this).fadeOut("250", function () {
                $(this).remove();
            })
        }
    );
}

Это не будет работать с настраиваемой анимацией разрыва, которую вы определили для скрытия всплывающей подсказки, хотя мне пришлось удалить ее, и она просто исчезнет:

/*hide: {
    effect: "explode",
    delay: 5
},*/

Затем вам нужно будет добавить следующий код, чтобы всплывающая подсказка отображала HTML, но имейте в виду, что вы потенциально открываете свой сайт до уязвимости XSS, делая следующее:

content: function () {
    return $(this).prop('title');
},

Смотрите здесь для скрипки