2010-09-14 7 views
3

Je n'arrive pas à comprendre pourquoi les info-bulles des outils jQuery s'affichent au mauvais endroit. Passez la souris sur l'une des trois cases grises sur la page this (par exemple, "enregistrement de l'écran &"), et les astuces devraient apparaître au-dessus de la boîte centrée.Les info-bulles sont mal positionnées sur le vol stationnaire

+0

Il n'est pas nécessaire d'utiliser un raccourcisseur d'URL. Essayez-vous d'effacer le 'referrer'? – alex

+1

@alex, non ne veut pas que l'URL soit indexée. –

Répondre

2

Il existe une propriété offset pouvant être utilisée pour déplacer l'info-bulle vers la position correcte: http://flowplayer.org/tools/tooltip/index.html#positioning. Faites simplement défiler un peu vers la table et là, il explique la propriété offset. Assurez-vous de vérifier le site sur plusieurs navigateurs, de sorte que vous pouvez être sûr que le offset n'a pas besoin de changer.

Il me semble que le décalage devrait être d'environ [0, -150]. Essayez ceci:

$(".tooltip").tooltip({ 
    track: true, 
    delay: 0, 
    showURL: false, 
    showBody: " - ", 
    fade: 250, 
    offset : [0, -150] 
}); 
+0

Merci SimpleCoder. Je l'ai mis à jour avec le décalage, et c'est différent sur Windows et Mac. Les deux FF/Safari Mac montrent environ 150px plus à droite, tandis que IE6/7/8/FF/Chrome Windows montrent tous centré maintenant. Il semble que je devrais peut-être régler le problème racine, car ils étaient à l'origine alignés, mais d'une manière ou d'une autre au cours du projet, ils se sont détraqués. Des idées? –

+0

Vous devrez probablement tester le site sur différents navigateurs, de sorte que vous puissiez affiner le décalage pour chacun d'entre eux. Je ne sais pas pourquoi le décalage est réellement nécessaire, mais tant que le décalage fonctionne, je ne vois pas de problème à l'utiliser. –

0

Sur le je trouve ce style d'élément dans le code source (vérifié avec Firebug):

pour # enregistrement pointe

element.style 
{ 
display:none; 
    left:371.5px; 
opacity:0; 
position:absolute; 
top:391.2px; 
} 

Cette propriété gauche est à l'origine à afficher dans le "mauvais" endroit. J'utilise le même plug-in pour mon info-bulles, retirer cette propriété reste dans le style et vous devez définir :)

Edit: Après un peu plus jouer autour, je trouve que cela est ajouté par le jQuery lui-même, mais ceci n'est pas présent dans la version que j'utilise, utilisez-vous des animations ou des effets personnalisés?

Questions connexes