Info bull sur lien

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Info bull sur lien

Message par Norm Hyck le Dim 30 Déc 2012 - 22:04

Bonjour à tous, pourriez vous me dire comment fait ton des infobull sur un Lien, au passage de la souris Wink comme ce site www.anakiworld.com voici une image pour vous aidez



et un grand merci à celui qui m'aidera


Dernière édition par Norm Hyck le Lun 31 Déc 2012 - 20:32, édité 1 fois

Norm Hyck
***

Masculin
Messages : 184
Inscrit(e) le : 12/07/2012

http://galaxyworld.forumactif.com
Norm Hyck a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Info bull sur lien

Message par Dr. Sam le Dim 30 Déc 2012 - 23:59

Bonsoir,

En voyant votre demande, j'ai fait un petit teste. Vous pouvez voir le teste ici, http://cubicdev.info/forumactif/infobull-pour-norm_nyck.html

Si c'est quelque chose qui vous convient je peux vous passer le code. Est-ce que vous voulez que j'apporte quelques modifications ?


Cordialement,
Smile

Dr. Sam
*****

Masculin
Messages : 894
Inscrit(e) le : 28/06/2012

http://www.fa-aide.com/
Dr. Sam a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Info bull sur lien

Message par Norm Hyck le Lun 31 Déc 2012 - 9:40

c'est parfait amis si un du texte en dessous de l'infobull ca marchera ? Wink

si oui merci

Norm Hyck
***

Masculin
Messages : 184
Inscrit(e) le : 12/07/2012

http://galaxyworld.forumactif.com
Norm Hyck a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Info bull sur lien

Message par Dr. Sam le Lun 31 Déc 2012 - 19:52

Je ne comprend pas ta question Razz... Mais le texte est changeable et tout, comme l'image Wink

Pour commencer, place ce CSS dans la feuille de style CSS de ton forum:
Code:
.infobulle{
position: relative;
z-index: 0;
}
 
.infobulle:hover{
background-color: transparent;
z-index: 50;
height: auto;
}
 
.infobulle span{
position: absolute;
background-color: #000000;
padding: 5px;
left: -1000px;
visibility: hidden;
color: #fff;
}
 
.infobulle span img{
border: 2px;
padding: 5px;
}
 
.infobulle:hover span{
visibility: visible;
top: 20px;
left: 0;
width: 350px ;
color:#fff;
border-radius: 5px 5px 5px 5px;
font-weight: bold;
}

Ensuite là ou tu veux ton infobull avec le lien, tu prend ce code:
Code:
<div class="infobulle"><a href="#">Voici un lien, quand ont met la souris dessus une infobull apparait en dessous</a><br />
<span>
<img src="http://icons.iconarchive.com/icons/ampeross/lamond/64/gif-icon.png" style="float: right;">
TITRE
<br /><font style="font-size: 12px;">
texte texte texte texte texte texte<br />
texte texte texte texte texte texte<br />
texte texte texte texte texte texte<br />
texte texte texte texte texte texte<br />
texte texte texte texte texte texte<br />
texte texte texte texte texte texte<br />
</font>
</span>
</div>

Cordialement,
Smile

Dr. Sam
*****

Masculin
Messages : 894
Inscrit(e) le : 28/06/2012

http://www.fa-aide.com/
Dr. Sam a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Info bull sur lien

Message par Norm Hyck le Lun 31 Déc 2012 - 20:31

merci beaucoup je le met en résolu

Norm Hyck
***

Masculin
Messages : 184
Inscrit(e) le : 12/07/2012

http://galaxyworld.forumactif.com
Norm Hyck a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum