мини-экран всплывающие при наведении мыши

Question

Я не могу понять, как сформулировать этот вопрос, если честно. : /

Но я пытаюсь получить следующий эффект:

http://zack.scudstorm.com/example.png

Мне было интересно, может ли кто-нибудь здесь помочь мне попытаться выяснить, как добиться этого эффекта, как показано на рисунке? : /

Эффект, как видно на изображении, заключается в том, что при наведении курсора на изображение или на то, с чем я связываю событие «onmouseover», отображается «всплывающее окно», отображающее текст и другую информацию, которая может потребоваться для отображения. 1010 *

Заранее спасибо!
-Zack

P.S. Извините за пример из WoW; это единственное, о чем я мог подумать, пытаясь описать этот эффект.

Answer 1

Проверьте любой из множества плагинов для всплывающих подсказок jQuery.

qTip кажется довольно хорошим.

Answer 2

MooTools также имеет несколько полезных советов для мыши:

Документация MooTools: класс подсказок

Демо / Учебник

Answer 3

Вот какой-то псевдокод, чтобы начать:

привязать событие наведения мыши к ссылке - в jquery: $('a.popup').mouseover(function(){ /* code here */ });

в случае обнаружения положения мыши
создать (или использовать уже созданный) div для хранения вашей информации
поместите div непосредственно в элемент body, чтобы вы могли абсолютно точно расположить его
используйте положение мыши, которое вы нашли ранее, чтобы расположить ваш div у мыши (или относительно мыши)

привязать событие мыши к ссылке
в случае скрытия абсолютно позиционированной информации div

применить хорошие стили в таблице стилей:)

Вот и все. Это не так сложно - если вы используете jquery, все это есть в документации.

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