Infobulles

Publié le par lali



Une infobulle est un message qui apparaît
lors du passage du curseur de la souris
sur certains éléments


Comment proceder?
1. Premier code a mettre dans votre CSS
Si vous êtes en mode avancé,
pensez à le faire dans accueil, page et article
Le mieux est de le mettre tout en bas de votre feuille de style




a.viewpic {
  position:relative;
  border-bottom:1px dashed #808080;
  text-decoration: none;
}
a:hover.viewpic {
  text-decoration: none;
  background: none;
}
a.viewpic span {display: none;}

a:hover.viewpic span {
  display: inline;
  position: absolute;
  top: -20px;
  left: 10px;
  z-index: 20;
  width:100%;
  padding:2px 4px;}



2. Ensuite il vous faudra remplacer le mot
que vous souhaitez
Pour cela allez dans votre article
Prendre l'adresse de celui ci en haut de votre éditeur
Dans votre HTML remplacez le mot par ce code


<a class="viewpic"href= Adresse de votre article">mot en question<span><img src="adresse de l'image" alt="mot en question" /></span></a>

Remplacez évidemment par vos informations
les phrases de couleur orange


Exemple

Je joue avec <a class="viewpic" href="http://lali-blogtest.over-blog.com/article-34233352.html">le chat<span><img src="http://pmsc.free.fr/I01/09725233131.gif" alt="le chat" /></span></a> en   cueillant <a class="viewpic" href="http://lali-blogtest.over-blog.com/article-34233352.html">des fleurs<span><img src="http://pmsc.free.fr/I01/09725233756.gif" alt="des fleurs" /></span></a>

Je joue avec le chatle chat en cueillant des fleursdes fleurs


ou dans cet article


Et voila rien de plus simple
Videz votre cache après toute modification

Autres articles dans cette catégorie



Pensez a remplir aussi le formulaire
Pour toutes demandes de
créations graphiques


Publié dans Aide pour blogs

Commenter cet article

Josiane Derwa Fondatrice de Crée Ta Vie 16/09/2009 12:17

J'AI REUSSI ! j'ai essayé un tuto reçu sur un autre blog et ça n'a pas fonctionné car trop compliqué pour  moi. Avec ta façon à toi, cela a marché du premier coup ! Merci Lali. Douce journée.

lali 16/09/2009 13:34


Super josiane
L'explication ne peut etre plus simple
bonne journée


Fee des Bois 27/07/2009 08:00

Merci beaucoup pour tous ces ensignements de pro !!!!

lali 27/07/2009 14:06


Holala je suis loin d'être une pro


ninine 26/07/2009 23:49

j ai fait le mule, mais le soleil de cet apres a eu raison de moi lol j ai pas tout compris alors je repasserai demain bizzzzzz

ninine 26/07/2009 21:54

grace a toi lali, il faut rendre a cesar ce qui appartient a césar

lali 26/07/2009 22:05


Ho mais c'est toi qui fais le boulot


ninine 26/07/2009 21:35

oups j ai la tete a l envers ce soir désolée mais ,jje garde le lien en memoire et reviens plus tard bizzz

lali 26/07/2009 21:47


OUiiiiiiiii il vaut mieux
Mais tu commence a bien te débrouiller