Показать окно с информацией (подсказка или всплывающее окно) через jQuery

Question

В 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(), которую я могу позвонить, когда захочу.

Answer 1

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

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

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

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

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

Answer 2

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

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

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