Vérifiez vos informations

Il semblerait que les informations techniques de votre profil n'aient pas été actualisées depuis un certain temps... Pour que l'aide apportée vous soit efficace, il est important que ces informations soient à jour : prenez quelques secondes pour confirmer ou compléter les informations suivantes.


Lien de votre forum
Version de ce forum
Vous êtes le fondateur de ce forum
Vous avez modifié le CSS de ce forum
Vous avez modifié les templates de ce forum
Votre navigateur

Code pour Infobulle..

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

Résolu Code pour Infobulle..

Message par Vaaléeriiee le Mer 29 Déc 2010 - 4:36

Bonjour, j'ai été sur CSS-actif pour savoir comment faire un infobulle.. malheureusement cela ne réussit pas.

Voila le code de mon PA :

Code:
<A class=infobulle><IMG src="http://img832.imageshack.us/img832/961/16094202.png"><SPAN>
<TABLE><BR><IMG src="http://40.img.v4.skyrock.net/404/x--vampires-diaries--x/pics/photo_68712245_8.gif"> <BR>Fondatrice <BR><DIV><A class=postlink href="http://frenchsandamericans.forum-canada.com/privmsg?mode=post&amp;u=1" target=_blank>La Contacter</A></DIV><DIV><A class=postlink href="http://frenchsandamericans.forum-canada.com/u1" target=_blank></DIV>Son Profil</SPAN>
<TBODY></TBODY></TABLE></A></A>
<p></p><DIV style="TEXT-ALIGN: justify"><FONT size=1><SPAN style="COLOR: rgb(153,149,82); FONT-WEIGHT: bold"></SPAN></FONT> </DIV><DIV style="TEXT-ALIGN: justify"><FONT size=1><SPAN style="COLOR: rgb(153,149,82); FONT-WEIGHT: bold"></SPAN></FONT> </DIV><DIV style="TEXT-ALIGN: justify"><FONT size=1><SPAN style="COLOR: rgb(153,149,82); FONT-WEIGHT: bold"></SPAN></FONT> </DIV><DIV style="TEXT-ALIGN: justify"><FONT size=1><SPAN style="COLOR: rgb(153,149,82); FONT-WEIGHT: bold">SYNOPSIS ♛</SPAN>À VENIR. </FONT><FONT size=1><SPAN style="COLOR: rgb(135,113,101); FONT-WEIGHT: bold"></SPAN></SPAN></A></FONT></DIV>
<p></p><DIV></DIV><FONT size=1><SPAN style="FONT-WEIGHT: bold"></SPAN></FONT><DIV></DIV><DIV></DIV></TD><TD style="BORDER-LEFT: rgb(50,50,49) 3px dotted; VERTICAL-ALIGN: top" width="35%"><DIV style="TEXT-ALIGN: justify; PADDING-BOTTOM: 15px; PADDING-LEFT: 15px; PADDING-RIGHT: 15px" width="400"><FONT size=1><SPAN style="COLOR: rgb(153,149,82); FONT-WEIGHT: bold">INFORMATIONS ♛</SPAN> À VENIRfont><BR><DIV style="TEXT-ALIGN: center"><FONT size=1></FONT>
<P style="TEXT-ALIGN: justify"><SPAN style="COLOR: rgb(135,113,101); FONT-WEIGHT: bold"></SPAN><FONT size=1><FONT size=1><SPAN style="COLOR: rgb(135,113,101); FONT-WEIGHT: bold"></SPAN></FONT><FONT size=1><SPAN style="COLOR: rgb(153,149,82); FONT-WEIGHT: bold">ANNONCE DU 27.10.10 ♛</SPAN> À VENIR</FONT></FONT></p></DIV><DIV style="TEXT-ALIGN: center"><SELECT onchange=document.location=this.options[this.selectedIndex].value> <OPTION selected value=#>TOP PARTENAIRES</OPTION> <OPTION value=LIEN>option 1</OPTION> <OPTION value=LIEN>option 2</OPTION> <OPTION value=LIEN>Option 3</OPTION> <OPTION value=LIEN>Option 4</OPTION> <OPTION value=LIEN>Option 5</OPTION> <OPTION value=LIEN>Option 6</OPTION> <OPTION value=LIEN>Option 7</OPTION> <OPTION value=LIEN>Option 8</OPTION> <OPTION value="Option 9</option> <option value=" LIEN?>Option 10</OPTION> <OPTION value=LIEN>Option 11</OPTION></SELECT><FONT size=1><BR><BR><A href="LIEN"><SPAN style="FONT-WEIGHT: bold">nos partenaires</SPAN></A><SPAN style="FONT-WEIGHT: bold"> </SPAN><FONT size=1>●</FONT><FONT size=1><SPAN style="FONT-WEIGHT: bold"> <A href="LIEN">devenir ?</A><BR></SPAN></FONT></FONT></DIV></DIV></TD></TR></TBODY></TABLE><DIV></DIV><DIV></DIV><BR><BR>
<CENTER><DIV class=decofiche4><FONT face="Times New Roman"><A href="LIEN">✥ Reglements</A> × <A href="LIEN">Scenario</A> × <A href="Lien">vacants</A> × <A href="LIEN">annonces</A> × <A href="LIEN">invités ✥</A> </FONT></DIV></CENTER></FONT>

Mon CSS :

Code:
a.infobulle {
  position: relative;
}

a.infobulle span {
  display: none; /* ceci masque l'infobulle */
}
a.infobulle:hover {
  background: none; /* correction d'un bug IE */
  z-index: 999; /* on définit une valeur pour l'ordre d'affichage */

}
a.infobulle:hover span {
  display: inline; /* ceci affiche l'infobulle */
  position: absolute;

  white-space: nowrap; /* on change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non-désiré */

  top: 5px; /* on positionne notre infobulle */
  left: 30px;

  background: #ebebeb; /* arrière-plan de l'infobulle */

  color: black; /* texte dans l'infobulle */
  padding: 3px;

  /* bordures de votre infobulle*/
  border: 1px dotted black;
  border-left: 1px dotted black;
}

Si vous voulez avoir un apercu de mon problème c'est ici :www.frenchamericanpeople.forum-canada.com

Merci D'avance


Dernière édition par Vaaléeriiee le Mer 29 Déc 2010 - 19:41, édité 1 fois
avatar

Vaaléeriiee
***

Féminin
Messages : 136
Inscrit(e) le : 09/12/2009

http://thesimsliveyourlife.forum-canada.com/
Vaaléeriiee a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour Infobulle..

Message par Vaaléeriiee le Mer 29 Déc 2010 - 5:36

Nouveauté : Si je clique sur mon image, l'infobulle apparaît 2 secondes puis disparait...
avatar

Vaaléeriiee
***

Féminin
Messages : 136
Inscrit(e) le : 09/12/2009

http://thesimsliveyourlife.forum-canada.com/
Vaaléeriiee a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour Infobulle..

Message par ge80 le Mer 29 Déc 2010 - 8:51

Bonjour

J'ai consulté le lien.
De quelle image est-il question car pour moi rien ne fonctionne en infobulle ?

Suis-je mal réveillé ?

Cordialement
ge
avatar

ge80
Membre actif

Masculin
Messages : 16160
Inscrit(e) le : 08/10/2006

http://tsi80.forumpro.eu
ge80 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour Infobulle..

Message par no_way le Mer 29 Déc 2010 - 11:00

Bonjour, désolé mais dans votre PA je trouve ceci:
Code:
<div class="infobulle"><img src="http://img832.imageshack.us/img832/961/16094202.png">...</div>

il vous faut indiquer ceci:
Code:
<div><a class="infobulle"><img src="http://img832.imageshack.us/img832/961/16094202.png"><span>......</span></a></div>
avatar

no_way
Aidactif
Aidactif

Messages : 2026
Inscrit(e) le : 26/03/2010

no_way a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour Infobulle..

Message par Vaaléeriiee le Mer 29 Déc 2010 - 18:49

@ge : Il s'agit d'une icone sur ma PA une icone de Nina Dobrev.

@ no_way : Malheureusement, même si je le remplace.. sa ne marche pas... Pourtant j'ai tout fait comme il le fallait...
avatar

Vaaléeriiee
***

Féminin
Messages : 136
Inscrit(e) le : 09/12/2009

http://thesimsliveyourlife.forum-canada.com/
Vaaléeriiee a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour Infobulle..

Message par ge80 le Mer 29 Déc 2010 - 18:57

Dans votre CSS je vois des lignes de traits.
-----------------------------------------
Est-ce le cas ou est-ce une erreur lors de ma lecture ?


avatar

ge80
Membre actif

Masculin
Messages : 16160
Inscrit(e) le : 08/10/2006

http://tsi80.forumpro.eu
ge80 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour Infobulle..

Message par Vaaléeriiee le Mer 29 Déc 2010 - 18:59

Oui, c'est pour m'aider dans mon CSS, sa me dit que c'est une nouvelle partie...
avatar

Vaaléeriiee
***

Féminin
Messages : 136
Inscrit(e) le : 09/12/2009

http://thesimsliveyourlife.forum-canada.com/
Vaaléeriiee a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour Infobulle..

Message par ge80 le Mer 29 Déc 2010 - 19:02

donc il faut l'écrire comme ceci :
/* ----------------------------------------- */

sinon c'est une erreur et votre CSS sera ignorée !
avatar

ge80
Membre actif

Masculin
Messages : 16160
Inscrit(e) le : 08/10/2006

http://tsi80.forumpro.eu
ge80 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour Infobulle..

Message par Vaaléeriiee le Mer 29 Déc 2010 - 19:04

J'essaye tout de suite
avatar

Vaaléeriiee
***

Féminin
Messages : 136
Inscrit(e) le : 09/12/2009

http://thesimsliveyourlife.forum-canada.com/
Vaaléeriiee a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour Infobulle..

Message par ge80 le Mer 29 Déc 2010 - 19:09

Et vous avez plusieurs lignes à corriger !
avatar

ge80
Membre actif

Masculin
Messages : 16160
Inscrit(e) le : 08/10/2006

http://tsi80.forumpro.eu
ge80 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour Infobulle..

Message par Vaaléeriiee le Mer 29 Déc 2010 - 19:12

Ah bon ? J'ai chanegr un peu, j'ai essayer de le refaire...

Je dois corriger dans lequel ? Le PA ou Le Css ?
avatar

Vaaléeriiee
***

Féminin
Messages : 136
Inscrit(e) le : 09/12/2009

http://thesimsliveyourlife.forum-canada.com/
Vaaléeriiee a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour Infobulle..

Message par ge80 le Mer 29 Déc 2010 - 19:14

Dans votre feuille de style (CSS) via le panneau d'administration -> Affichage -> couleurs -> puis CSS...

car je ne pense pas que vous ayez du style dans votre page d'accueil.
avatar

ge80
Membre actif

Masculin
Messages : 16160
Inscrit(e) le : 08/10/2006

http://tsi80.forumpro.eu
ge80 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour Infobulle..

Message par Vaaléeriiee le Mer 29 Déc 2010 - 19:18

D'accord, je vais voir ce que je peut faire, j'ai fait un copier/coller du tutoriel proposé sur css-actif..donc c'est pour ça.. je suis capable de faire certaines choses en CSS mais pas beaucoup

Je vais voir ça..
avatar

Vaaléeriiee
***

Féminin
Messages : 136
Inscrit(e) le : 09/12/2009

http://thesimsliveyourlife.forum-canada.com/
Vaaléeriiee a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour Infobulle..

Message par ge80 le Mer 29 Déc 2010 - 19:23

OK
J'attends le résultat de la correction.
avatar

ge80
Membre actif

Masculin
Messages : 16160
Inscrit(e) le : 08/10/2006

http://tsi80.forumpro.eu
ge80 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour Infobulle..

Message par no_way le Mer 29 Déc 2010 - 19:26

Idem car pour moi c'est bon:
voir
avatar

no_way
Aidactif
Aidactif

Messages : 2026
Inscrit(e) le : 26/03/2010

no_way a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour Infobulle..

Message par Vaaléeriiee le Mer 29 Déc 2010 - 19:31

Je ne vois vraiment pas ce qui peut-être mauvais dans mon css... J'ai regarder ligne par ligne mais franchement..je ne vois absolument rien... Je vais réessayer quelque chose...
avatar

Vaaléeriiee
***

Féminin
Messages : 136
Inscrit(e) le : 09/12/2009

http://thesimsliveyourlife.forum-canada.com/
Vaaléeriiee a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour Infobulle..

Message par ge80 le Mer 29 Déc 2010 - 19:34

Donc ceci n'existe pas ---------------------------------------- ?

Cela pourrait expliquer la non exécution de votre CSS spécifique.
avatar

ge80
Membre actif

Masculin
Messages : 16160
Inscrit(e) le : 08/10/2006

http://tsi80.forumpro.eu
ge80 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour Infobulle..

Message par Vaaléeriiee le Mer 29 Déc 2010 - 19:37

Pourtant je l'ai arrangé, regardé par vous même

Code:

/* ----------------------------------------- */

a.infobulle {
  position: relative;
}

a.infobulle span {
  display: none; /* ceci masque l'infobulle */
}
a.infobulle:hover {
  background: none; /* correction d'un bug IE */
  z-index: 999; /* on définit une valeur pour l'ordre d'affichage */

}
a.infobulle:hover span {
  display: inline; /* ceci affiche l'infobulle */
  position: absolute;

  white-space: nowrap; /* on change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non-désiré */

  top: 5px; /* on positionne notre infobulle */
  left: 15px;

  background: #ebebeb; /* arrière-plan de l'infobulle */

  color: black; /* texte dans l'infobulle */
  padding: 3px;

  /* bordures de votre infobulle*/
  border: 3px dotted black;
  border-left: 1px dotted black;
}

/* ----------------------------------------- */

 

Edit : Même sans.. sa ne marche toujours pas...


Dernière édition par Vaaléeriiee le Mer 29 Déc 2010 - 19:39, édité 1 fois
avatar

Vaaléeriiee
***

Féminin
Messages : 136
Inscrit(e) le : 09/12/2009

http://thesimsliveyourlife.forum-canada.com/
Vaaléeriiee a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour Infobulle..

Message par no_way le Mer 29 Déc 2010 - 19:38

logique voici ce que vous avez mis dans votre PA:
Code:

<a href="#" class="infobulle"><img src="http://img832.imageshack.us/img832/961/16094202.png">
<span></span></a><a href="#" class="infobulle">Lexi A. Wilson</a><br>
<a href="#" class="infobulle"><img src="http://40.img.v4.skyrock.net/404/x--vampires-diaries--x/pics/photo_68712245_8.gif"></a>
hors il faut un span qui ne soit pas vide !
Code:

<a class="infobulle"><img src="http://img832.imageshack.us/img832/961/16094202.png">
<span>contenu</span></a><a class="infobulle">Lexi A. Wilson</a><br>
<a class="infobulle"><img src="http://40.img.v4.skyrock.net/404/x--vampires-diaries--x/pics/photo_68712245_8.gif"><span>contenu</span></a>

Je me suis permis de supprimer l'attribut href puisque que vos liens ne mènent nul part.
avatar

no_way
Aidactif
Aidactif

Messages : 2026
Inscrit(e) le : 26/03/2010

no_way a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour Infobulle..

Message par ge80 le Mer 29 Déc 2010 - 19:40

cheers no_way

Et avec la bonne CSS ceci devrait fonctionner !
avatar

ge80
Membre actif

Masculin
Messages : 16160
Inscrit(e) le : 08/10/2006

http://tsi80.forumpro.eu
ge80 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour Infobulle..

Message par Vaaléeriiee le Mer 29 Déc 2010 - 19:41

Voila.. Maintenant je vois mon infobulle... Merci.. c'est vraiment gentil
avatar

Vaaléeriiee
***

Féminin
Messages : 136
Inscrit(e) le : 09/12/2009

http://thesimsliveyourlife.forum-canada.com/
Vaaléeriiee a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour Infobulle..

Message par no_way le Mer 29 Déc 2010 - 19:42

Yep victoire
ça devrait aller beaucoup mieux .
De rien et à une prochaine Wink.

PS:
Vous avez refait une erreur !
Faites un copié/collé du code que je vous ai donné Wink.


Dernière édition par no_way le Mer 29 Déc 2010 - 19:44, édité 1 fois
avatar

no_way
Aidactif
Aidactif

Messages : 2026
Inscrit(e) le : 26/03/2010

no_way a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour Infobulle..

Message par ge80 le Mer 29 Déc 2010 - 19:43

Et bien voilà un travail d'équipe rondement mené ok

Cela fonctionne nickel et sans conflit Wink.

bonne soirée

victoire
avatar

ge80
Membre actif

Masculin
Messages : 16160
Inscrit(e) le : 08/10/2006

http://tsi80.forumpro.eu
ge80 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code pour Infobulle..

Message par no_way le Mer 29 Déc 2010 - 19:45

Là, c'est vraiment du travail d'équipe oui ^^.
avatar

no_way
Aidactif
Aidactif

Messages : 2026
Inscrit(e) le : 26/03/2010

no_way 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