J’ai décidé cette semaine de me pencher sur le script de tooltip présenté sur le site de gloubiweb.
Dans une première partie je présenterai rapidement le fonctionnement du script actuel, et dans une deuxième, je vous indiquerai comment recréer (quasi) à l’identique cet ancien script.
Présentation de du code existant
Le script actuel se compose de plusieurs fonctions et classes assurant les différents traitements nécessaires, et comme pour d’autres gloubi scripts déjà présentés, les textes à faire apparaître sont renseignés directement dans le JavaScript.
La première fonction, DetecteNavigateur(), est là, comme son nom l’indique, pour détecter le navigateur du visiteur de la page et renseigner automatiquement des variables qui seront utilisées plus tard pour faire quelques ajustement selon le type du navigateur détecté. Ce genre de fonction n’est plus nécessaire de nos jours, car tous (ou presque) les navigateurs modernes fonctionnent de la même façon (ou de façon très proche) au niveau du JS.
Ensuite viens la classe CreationFenetre, qui possède 4 méthodes :
– measureIt() : permet de mesurer la taille exacte du tooltip (utile pour son positionnement par rapport aux bords de la fenêtre de navigation)
– writeIt() : permet de changer le texte à l’intérieur du tooltip
– blendIn() et fadeIn() : ces deux fonctions permettaient de faire apparaître le tooltip de manière progressive, mais aucune des deux n’est encore fonctionnelle, car elles utilisent des propriétés et méthodes n’existant plus dans les navigateurs modernes
Il y a ensuite d’autres fonctions dont les plus importantes sont :
– DetecteMouvementSouris() (le nom de cette fonction est suffisamment explicite pour que je n’ai pas à préciser sa tache)
– PositionneFenetre() (la même)
– AfficheTexte(), cette fonction a pour rôle de changer le contenu du tooltip.