Показывать информационное окно (всплывающую подсказку или всплывающее окно) через jQuery - PullRequest
0 голосов
/ 27 марта 2012

В веб-приложении asp.net/c# я пишу сценарий jQuery.

У меня есть функция события, подобная этой:

function showInfo(event,label){
    switch (label)
    {
        case 'America':
            //Show America's info
            break;
        case 'Europe':
            //Show Europe's info
            break;
        case 'Africa':
            //Show Europe's info
            break;
    }
}

Я хочу показать информацию вкоробка.Информационное поле должно поддерживать основные элементы HTML, такие как изображения и таблицы;Каков наилучший способ сделать это?

Я пытался использовать qtip2 , но я не знал, как показать всплывающую подсказку через эту функцию (Нет элементов, которые бы связывали подсказку с).
Я хочу иметь такую ​​функцию, как ShowTooltip(), которую я могу вызывать, когда захочу.

Ответы [ 2 ]

2 голосов
/ 27 марта 2012

Дайте все элементы, которые вы хотите сделать, одному и тому же классу, затем создайте функцию при наведении, например, так:

$('body').on("hover", ".tooltipclass", hoveron, hoveroff);

Затем создайте свои функции включения / выключения при наведении.В зависимости от того, к какому типу элементов вы пытаетесь это сделать, существует множество способов достижения этого, вы можете присвоить элементу другое имя класса, например, Америка или Европа, а затем использовать $ (this) .hasClass, чтобы проверить, какую подсказку отображать.

Что касается действительной механики отображения всплывающей подсказки, вы можете уже скрыть подсказки на странице или вызвать их с помощью вызова AJAX, а затем расположить их в зависимости от положения мыши, см. Здесьhttp://docs.jquery.com/Tutorials:Mouse_Position

Конечно, многие уже сделали это, так что вы можете просто найти плагин всплывающей подсказки

0 голосов
/ 27 марта 2012

Если вы ищете простой плагин всплывающей подсказки, взгляните на этот плагин jQuery Tooltip

Он поддерживает HTML-код (и затем IMG), как вы просили, и прост в использовании. Плагин находится под лицензией MIT / GPL.

Надеюсь, эта помощь.

...