Ajout de groupes avec infobulles à mon qeel
2 participants
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1 • Partagez
Ajout de groupes avec infobulles à mon qeel
Bonjour/bonsoir
Donc aujourd'hui je bloque sur un gros problème .. l'affichage de mes groupes
J'ai un qeel normal .. avec juste une image, et là je me rend compte que j'avais oublié de mettre mes groupes Donc un peu le flemme de refaire l'image du qeel, je décide de mettre mes groupes juste au dessus de celle ci. Et comme moi et les infobulles ca fait ... 1000, bah je bloque carrément xD
Bref, mon problème est simple, je voudrais juste mettre mes groupes alignés, parce que là ils sont l'un au dessous de l'autre. comme vous pouvez le voir ici : http://pooop-s.forumgratuit.org/forum.
Bon j'ai déjà réussi à faire des infobulles Mais je voudrais aussi qu'elles aient un effet de transition lors du survol.
Mon template:
CSS :
Merci beaucoup :thanks: :thanks:
Donc aujourd'hui je bloque sur un gros problème .. l'affichage de mes groupes
J'ai un qeel normal .. avec juste une image, et là je me rend compte que j'avais oublié de mettre mes groupes Donc un peu le flemme de refaire l'image du qeel, je décide de mettre mes groupes juste au dessus de celle ci. Et comme moi et les infobulles ca fait ... 1000, bah je bloque carrément xD
Bref, mon problème est simple, je voudrais juste mettre mes groupes alignés, parce que là ils sont l'un au dessous de l'autre. comme vous pouvez le voir ici : http://pooop-s.forumgratuit.org/forum.
Bon j'ai déjà réussi à faire des infobulles Mais je voudrais aussi qu'elles aient un effet de transition lors du survol.
Mon template:
- Code:
<!-- BEGIN disable_viewonline -->
<center>
<span class="infobulle"><div class="groupes"><a href="URL">débutant</a></div><span class="infobulle-hidden">Limitation à un collage. Aucune finition, et aucune technique. Aucun acquis.</span>
</span>
<span class="infobulle"><div class="groupes"><a href="URL">futur apprenti</a></div><span class="infobulle-hidden">Des bases manquant de travail, aucun approfondissement et pas de finitions.</span>
</span>
<span class="infobulle"><div class="groupes"><a href="URL">apprenti</a></div><span class="infobulle-hidden">Les bases sont comprises et maîtrisées au minimum. Manque d'originalité et bannières trop fades.</span>
</span>
<span class="infobulle"><div class="groupes"><a href="URL">futur grapheur</a></div><span class="infobulle-hidden">Maîtrise des bases. Fond, inscrutation et écritures bien réalisées, mais pouvant être amélioré.</span>
</span>
<span class="infobulle"><div class="groupes"><a href="URL">grapheur</a></div><span class="infobulle-hidden">Le graphisme est maîtrisé. Beaucoup de travail, de l'originalité et des finitions.</span>
</span>
<span class="infobulle"><div class="groupes"><a href="URL">professionnel</a></div><span class="infobulle-hidden">La perfection (Incrustation, Typographie, Finitions, Originalité, Travail ...)</span>
</span>
<span class="infobulle"><div class="groupes"><a href="URL">directrices</a></div><span class="infobulle-hidden">Comme le nom l'indique, elle dirigent le forum. Ouvre les nouveautés et annonces.</span>
</span>
<table cellspacing="2" cellpadding="2" width="750" style="background: url('http://img15.hostingpics.net/pics/528068qeel.png'); width: 750px; height: 477px;">
<tbody><tr><td><div class="tableqeel1"><span class="gensmall"><div style="font-size: 11px; line-height: 12px; text-align: justify;"><br>
<span id="mb_inscrits">{TOTAL_USERS}<script type="text/javascript">document.getElementById('mb_inscrits').innerHTML=document.getElementById('mb_inscrits').innerHTML.replace(/membres enregistrés/,"personnes inscrites sur Graph Perle,");</script></span> <span id="nb_messages">{TOTAL_POSTS}<script type="text/javascript">document.getElementById('nb_messages').innerHTML=document.getElementById('nb_messages').innerHTML.replace(/Nos membres ont posté un total de/,"qui aiment taper sur leurs claviers... Ils ont poster environ");</script></span>. <span id="newest">{NEWEST_USER}<script type="text/javascript">document.getElementById('newest').innerHTML=document.getElementById('newest').innerHTML.replace(/L'utilisateur enregistré le plus récent est/,"La dernière personne à s'être inscrit sur GP est");</script></span>, nous lui souhaitons la bienvenue parmi nous !<br/>
<span id="online">{TOTAL_USERS_ONLINE}<script type="text/javascript">document.getElementById('online').innerHTML=document.getElementById('online').innerHTML.replace(/ Enregistré/," grapheur(s)");document.getElementById('online').innerHTML=document.getElementById('online').innerHTML.replace(/Invité/, "sécheur(s) de cours");document.getElementById('online').innerHTML=document.getElementById('online').innerHTML.replace(/utilisateur en ligne/, "graph perlien(s)");</script></span> <br/>
<span id="onlineuser">{LOGGED_IN_USER_LIST}<script type="text/javascript">document.getElementById('onlineuser').innerHTML=document.getElementById('onlineuser').innerHTML.replace(/Utilisateurs enregistrés/,"Les grapheurs disponible en ce moment sur GP sont");</script></span>{RECORD_USERS}.</div></span></div></td>
<td><div class="tableqeel2"><span class="gensmall"><div style="height: 110px; overflow: auto;">
<table cellspacing="2" cellpadding="2" align="center" style="text-align: justify;" class="listlastconnected">
<tbody><tr><td class="row1">{L_CONNECTED_MEMBERS}</td></tr></tbody></table></div></span></div></td></center>
<!-- END disable_viewonline -->
CSS :
- Code:
/*INFOBULLE QEEL*/
.infobulle{
position: relative;}
.infobulle .infobulle-hidden {
display: none; position: absolute; visibility: visible; z-index: 999;
background-color: rgba(241, 220, 154, 0.9);
box-shadow: 0px 0px 5px 5px rgba(241, 220, 154, 0.9);
border-radius: 15px;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
margin-left: 80px;
font-size: 11px;
color: #927D61;
width: 170px;
}
.infobulle:hover .infobulle-hidden {
display: block;
}
.groupes{font-size: 19px;
text-shadow: white 0px 2px 0px;
font-family: Georgia, serif;
font-weight: bold;
font-style: italic;
color: #ACA648;
text-transform: lowercase;
letter-spacing: -1px;}
Merci beaucoup :thanks: :thanks:
Dernière édition par jiji98 le Ven 27 Juil 2012 - 23:26, édité 2 fois
Xibition- ****
-
Messages : 457
Inscrit(e) le : 23/05/2011
Xibition- ****
-
Messages : 457
Inscrit(e) le : 23/05/2011
Re: Ajout de groupes avec infobulles à mon qeel
Coucou !
Pour pouvoir aligner tes groupes l'un à côté de l'autre, tu dois les entourer de
C'est ce que j'ai fait, voilà ce que ça a adonné :
Bon, ça a créé quelques problèmes d'affichages mais je pense que tu seras capable de régler ça seule
(comme la position des infobulles, par exemple)
Dis-moi si l'alignement est juste ? ^^
Hum ?Mais je voudrais aussi qu'elles aient un effet de transition lors du survol.
Pour pouvoir aligner tes groupes l'un à côté de l'autre, tu dois les entourer de
- Code:
<td></td>
C'est ce que j'ai fait, voilà ce que ça a adonné :
- Code:
<!-- BEGIN disable_viewonline -->
<table style="text-align: center; width: 100%;" border="0" cellpadding="0" cellspacing="0"><tbody><tr><td width="150" valign="top"><center><span class="infobulle"><div class="groupes"><a href="URL">débutant</a></div><span class="infobulle-hidden">Limitation à un collage. Aucune finition, et aucune technique. Aucun acquis.</span>
</span></div></div></td>
<td width="150" valign="top"><span class="infobulle"><div class="groupes"><a href="URL">futur apprenti</a></div><span class="infobulle-hidden">Des bases manquant de travail, aucun approfondissement et pas de finitions.</span>
</span></div></div></td>
<td width="150" valign="top"><span class="infobulle"><div class="groupes"><a href="URL">apprenti</a></div><span class="infobulle-hidden">Les bases sont comprises et maîtrisées au minimum. Manque d'originalité et bannières trop fades.</span>
</span></div></div></td>
<td width="150" valign="top"><span class="infobulle"><div class="groupes"><a href="URL">futur grapheur</a></div><span class="infobulle-hidden">Maîtrise des bases. Fond, inscrutation et écritures bien réalisées, mais pouvant être amélioré.</span>
</span></div></div></td>
<td width="150" valign="top"><span class="infobulle"><div class="groupes"><a href="URL">grapheur</a></div><span class="infobulle-hidden">Le graphisme est maîtrisé. Beaucoup de travail, de l'originalité et des finitions.</span>
</span></div></div></td>
<td width="150" valign="top"><span class="infobulle"><div class="groupes"><a href="URL">professionnel</a></div><span class="infobulle-hidden">La perfection (Incrustation, Typographie, Finitions, Originalité, Travail ...)</span>
</span></div></div></td>
<td width="150" valign="top"><span class="infobulle"><div class="groupes"><a href="URL">directrices</a></div><span class="infobulle-hidden">Comme le nom l'indique, elle dirigent le forum. Ouvre les nouveautés et annonces.</span>
</span></div></div></td>
<table cellspacing="2" cellpadding="2" width="750" style="background: url('http://img15.hostingpics.net/pics/528068qeel.png'); width: 750px; height: 477px;">
<tbody><tr><td><div class="tableqeel1"><span class="gensmall"><div style="font-size: 11px; line-height: 12px; text-align: justify;"><br>
<span id="mb_inscrits">{TOTAL_USERS}<script type="text/javascript">document.getElementById('mb_inscrits').innerHTML=document.getElementById('mb_inscrits').innerHTML.replace(/membres enregistrés/,"personnes inscrites sur Graph Perle,");</script></span> <span id="nb_messages">{TOTAL_POSTS}<script type="text/javascript">document.getElementById('nb_messages').innerHTML=document.getElementById('nb_messages').innerHTML.replace(/Nos membres ont posté un total de/,"qui aiment taper sur leurs claviers... Ils ont poster environ");</script></span>. <span id="newest">{NEWEST_USER}<script type="text/javascript">document.getElementById('newest').innerHTML=document.getElementById('newest').innerHTML.replace(/L'utilisateur enregistré le plus récent est/,"La dernière personne à s'être inscrit sur GP est");</script></span>, nous lui souhaitons la bienvenue parmi nous !<br/>
<span id="online">{TOTAL_USERS_ONLINE}<script type="text/javascript">document.getElementById('online').innerHTML=document.getElementById('online').innerHTML.replace(/ Enregistré/," grapheur(s)");document.getElementById('online').innerHTML=document.getElementById('online').innerHTML.replace(/Invité/, "sécheur(s) de cours");document.getElementById('online').innerHTML=document.getElementById('online').innerHTML.replace(/utilisateur en ligne/, "graph perlien(s)");</script></span> <br/>
<span id="onlineuser">{LOGGED_IN_USER_LIST}<script type="text/javascript">document.getElementById('onlineuser').innerHTML=document.getElementById('onlineuser').innerHTML.replace(/Utilisateurs enregistrés/,"Les grapheurs disponible en ce moment sur GP sont");</script></span>{RECORD_USERS}.</div></span></div></td>
<td><div class="tableqeel2"><span class="gensmall"><div style="height: 110px; overflow: auto;">
<table cellspacing="2" cellpadding="2" align="center" style="text-align: justify;" class="listlastconnected">
<tbody><tr><td class="row1">{L_CONNECTED_MEMBERS}</td></tr></tbody></table></div></span></div></td></center>
<!-- END disable_viewonline -->
Bon, ça a créé quelques problèmes d'affichages mais je pense que tu seras capable de régler ça seule
(comme la position des infobulles, par exemple)
Dis-moi si l'alignement est juste ? ^^
Re: Ajout de groupes avec infobulles à mon qeel
Coucouu, merci beaucoup pour la réponse, ca marche nickel
Oui je ne suis pas assez claire désolée, au fait j'aimerais avoir cette effet là pour l'affichage des infobulles : http://www.css3create.com/Infobulle-avec-effet-de-transparence-en-CSS . J'aimerais faire comme cette sorte de bulle qui apparait plus lentement
J'ai essayé de suivre le tuto mais ca ne marche pas ..
PS : ne serait ce pas Hayley williams sur votre vava et bannière :youopi:
- Mais je voudrais aussi qu'elles aient un effet de transition lors du survol.
- Hum ?
Oui je ne suis pas assez claire désolée, au fait j'aimerais avoir cette effet là pour l'affichage des infobulles : http://www.css3create.com/Infobulle-avec-effet-de-transparence-en-CSS . J'aimerais faire comme cette sorte de bulle qui apparait plus lentement
J'ai essayé de suivre le tuto mais ca ne marche pas ..
PS : ne serait ce pas Hayley williams sur votre vava et bannière :youopi:
Xibition- ****
-
Messages : 457
Inscrit(e) le : 23/05/2011
Xibition- ****
-
Messages : 457
Inscrit(e) le : 23/05/2011
Re: Ajout de groupes avec infobulles à mon qeel
Salut !
Pour ton problème, pourrais-tu me donner le code que tu as obtenu pour que je zieute ça ?
Si, c'est bien elle ! Tu as l'oeilPS : ne serait ce pas Hayley williams sur votre vava et bannière
Pour ton problème, pourrais-tu me donner le code que tu as obtenu pour que je zieute ça ?
Re: Ajout de groupes avec infobulles à mon qeel
EDIT : J'ai finallement réussi à mettre des infobulles avec l'effet que je voulais, par contre j'ai mis des images
Et là j'ai un autre problème x) Y'a un très grand espace entre les images.. j'aimerais les rapprocher si c'est possible, et aussi est t'il possible de mettre une image de fond qui englobe toute la partie du groupe ?
Merci d'avance :thanks:
Voilà mes codes :
Et là j'ai un autre problème x) Y'a un très grand espace entre les images.. j'aimerais les rapprocher si c'est possible, et aussi est t'il possible de mettre une image de fond qui englobe toute la partie du groupe ?
Merci d'avance :thanks:
Voilà mes codes :
Xibition- ****
-
Messages : 457
Inscrit(e) le : 23/05/2011
Xibition- ****
-
Messages : 457
Inscrit(e) le : 23/05/2011
Re: Ajout de groupes avec infobulles à mon qeel
Coucou,
Pour y ajouter un fond, c'est super simple ^^
Il suffisait juste d'ajouter un petite partie. Pour l'espace entre les cellules, je vais voir ce qu'on peut faire
Pour y ajouter un fond, c'est super simple ^^
- Code:
<!-- BEGIN disable_viewonline -->
<table style="text-align: center; width: 100%; background: transparent url('LIEN IMAGE') no-repeat scroll 0% 0%; -moz-background-clip: border; -moz-background-origin: padding; -moz-background-inline-policy: continuous;" border="0" cellpadding="0" cellspacing="0" height="HAUTEUR" width="LARGEUR" border="0"><tbody><tr><td width="150" valign="top"><center><div class="transition-tfax">
Il suffisait juste d'ajouter un petite partie. Pour l'espace entre les cellules, je vais voir ce qu'on peut faire
Re: Ajout de groupes avec infobulles à mon qeel
D'accord merci beaucoup
EDIT : Enorme bug ! Mdr, bon comme je ne peux pas rester sans rien faire, je sais pas pourquoi J'ai encore fais une gaffe mdr !
Si vous allez visiter mon fofo, vous verrez le problème Au fait j'arrive pas à mettre les groupes sur l'image des groupes.. Même s'ils ne sont pas bien alignés, juste qu'ils soient dans le cadre. Je ne sais pas pourquoi je change d'idée comme ca vite fait
Encore désolée si je vous dérange
voici mon code actuel, promis je n'y touche plus **
EDIT : Enorme bug ! Mdr, bon comme je ne peux pas rester sans rien faire, je sais pas pourquoi J'ai encore fais une gaffe mdr !
Si vous allez visiter mon fofo, vous verrez le problème Au fait j'arrive pas à mettre les groupes sur l'image des groupes.. Même s'ils ne sont pas bien alignés, juste qu'ils soient dans le cadre. Je ne sais pas pourquoi je change d'idée comme ca vite fait
Encore désolée si je vous dérange
voici mon code actuel, promis je n'y touche plus **
Xibition- ****
-
Messages : 457
Inscrit(e) le : 23/05/2011
Xibition- ****
-
Messages : 457
Inscrit(e) le : 23/05/2011
Xibition- ****
-
Messages : 457
Inscrit(e) le : 23/05/2011
Xibition- ****
-
Messages : 457
Inscrit(e) le : 23/05/2011
Re: Ajout de groupes avec infobulles à mon qeel
Problème résolu, merci
Xibition- ****
-
Messages : 457
Inscrit(e) le : 23/05/2011
Sujets similaires
» Ajout d'un trait dans le QEEL
» Problème avec mes infobulles.
» Ajout dans le QEEL
» Ajout dans mon QEEL
» Problème avec les infobulles
» Problème avec mes infobulles.
» Ajout dans le QEEL
» Ajout dans mon QEEL
» Problème avec les infobulles
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum