popups mini-écran sur la souris sur

Question

Je ne peux pas comprendre comment formuler cette question pour être honnête. :/

Mais je suis en train d'obtenir l'effet suivant:

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

je me demandais si quelqu'un ici pourrait me aider à essayer de comprendre comment accomplir cet effet comme on le voit dans l'image? L'effet, comme on le voit dans l'image, est que lorsque je survole une image, ou quoi que ce soit que j'attache l'événement "onmouseover", un "popup" s'affiche montrant le texte et autres informations dont j'ai besoin afficher.

Merci d'avance!
-Zack

P.S. Désolé pour l'exemple étant de WoW; c'est la seule chose à laquelle je pourrais penser en essayant de décrire cet effet.

Answer 1

Heres un code pseudo pour vous aider à démarrer:

lier événement mouseover à la liaison - dans jquery: $('a.popup').mouseover(function(){ /* code here */ });

en cas trouver la position de la souris
créer (ou utilisez déjà créé) div pour tenir votre information
place div dans l'élément de corps directement de sorte que vous pouvez absolument le positionner
utiliser la position de la souris que vous avez trouvé plus tôt pour positionner votre div à la souris (ou par rapport à la souris)

souris se lient à l'événement pour lier
en cas cacher la position absolue d'info div

appliquent les bons styles dans la feuille de style :)

C'est tout ce qu'il ya à faire. Ce n'est pas si difficile - si vous utilisez jquery tout cela est dans les docs.

Hope this helps

Answer 2

Découvrez l'un des nombreux plugins d'info-bulle jQuery.

qTip semble être plutôt bon.

Answer 3

MooTools a quelques bons conseils de souris aussi:

MooTools docs: Tips Class

Demo/Tutorial