Archives des information

Temps de lecture : < 1 minute

Si votre site possède une partie un peu complexe, comme une zone membre avec des menus et des zones d’informations, vous souhaitez peut-être expliquer à vos utilisateurs la logique et le fonctionnement de tout cela. Habituellement, vous faites une vidéo ou un tutoriel expliquant à l’aide d’images votre projet.

Bootstro va vous permet de faire une suite d’infobulles, expliquant étape par étape, directement dans la page web, le fonctionnement de votre site. Ceci offre une multitude d’avantages. Le simple fait que l’utilisateur puisse à tout moment, sans quitter la page, accéder à l’aide, est déjà beaucoup.

Voici un exemple en images :

De plus on pourrais utiliser ce système sur des sites à contenu payant pour faire « un tour gratuit » ou bien encore pour présenter des templates HTML. Bref vous l’aurez compris, les utilisations de cet outils sont multiples.

Temps de lecture : < 1 minute

Quand vous souhaitez donner des informations à la volée, vous utilisez sûrement l’attribut title sur vos liens. Cependant, le rendu ne sera pas le même d’un navigateur à l’autre. De plus, les infos bulles basiques du navigateur ou du système d’exploitation sont rarement belles. Mais grâce au plugin JQuery tipTip vous allez pouvoir mettre en place des tooltips élégants. TipTip est fourni avec un CSS par défaut noir, mais libre à vous de le changer car il n’est pas très complexe.

Pour l’utiliser c’est très simple, pour le mot où vous souhaitez ajouter un tooltip il faut faire :

   <a class="tiptip" href="#" title="message tooltip">mot</a>

Et côté JavaScript, vous avez juste à faire appel au plugin sur votre classe tipTip :

    $(function(){
	$(".tiptip").tipTip();
    });

Voici un exemple en images, avec un contenu assez long dans la tooltip :

Étiquette : information

Présenter votre site Internet à vos utilisateurs

Des tooltips élégants avec tipTip