Design Version 4

Tu as un problème à quel niveau ? Tout marche chez moi.

Les contenus onglets s'affichent les uns en dessous des autres et les onglets s'affichent mal une fois survolés. Faut le tester sur le forum de Shayne qui a le qeel installé pour voir les conflits

Alors j'ai mis en place tes codes. Ca bug au niveau des onglets : http://testgraphnono.forumperso.com/

Bon, ben ça vient bien d'un conflit entre les deux... Va falloir faire autrement pour la PA, parceque là, j'ai tout essayé.

J'ai pas les beugs que tu as décris quand je les survole, pourtant même sur le fow test de Shayne

C'est bon ! J'ai réussit à trouver quelqu'un pour corriger le problème, y a plus de bug. Je vais finir tout ça au plus vite (mais probablement pas aujourd'hui, au pire je rechargerai ma clef 3G pour ce week-end)

Shayne, t'as zappé ma question pour les top-sites. On fait comment ?

Oh c'était quoi comme bug ?

Heu pour les tops sites. Hum soit on remet des chiffres (comme la), soit mettre une petite image genre une fleur de cerisier vu que ce sera un design spécial Bushido. A moins que tu es une autre idée ?

Je sais pas trop. Une codeuse est intervenue et m'a dit "tiens, c'est corrigé", et pouf ça marche lol. C'était la 3e à se mettre sur ce problème^^

Pour les top-sites, à toi de voir. Je vais coder avec les chiffres comme maintenant (mode feignasse), et tu verras si tu veux changer l'image Wink

Oep t'inquiète ^^

Bon, il va être minuit, ma valise est pas faite, mon appart est en bordel, et dans 9h je me casse... C'est la fete...

Bon, voilà la structure du truc, je vais devoir vous laisser faire le remplissage. Dsl.

Shayne, le code du Qeel a été modifié, je te le remet aussi.

La PA :

Code:: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr" dir="ltr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<script type="text/javascript">
//
</script>

</head>
<body>

<table width="800" height="528" cellspacing="10" style="background-image:url(http://img11.hostingpics.net/pics/437497sscpa4.png); repeat:no-repeat;" border="0">
<tr>
<td height="230" width="130" valign="top">
<div class="titres">A VOTRE SERVICE</div><br /><br />
<a class="info"><img src="http://i25.servimg.com/u/f25/11/25/40/17/josh10.png" border="0" alt="" /><span><img src="http://i25.servimg.com/u/f25/11/25/40/17/josh10.png" border="0" alt="" /></span></a> <a class="info"><img src="http://i25.servimg.com/u/f25/11/25/40/17/alona10.png" border="0" alt="" /><span><img src="http://i25.servimg.com/u/f25/11/25/40/17/alona10.png" border="0" alt="" /></span></a><br />
<a class="info"><img src="http://i25.servimg.com/u/f25/11/25/40/17/sam10.png" border="0" alt="" /><span><img src="http://i25.servimg.com/u/f25/11/25/40/17/sam10.png" border="0" alt="" /></span></a> <a class="info"><img src="http://i25.servimg.com/u/f25/11/25/40/17/ian10.png" border="0" alt="" /><span><img src="http://i25.servimg.com/u/f25/11/25/40/17/ian10.png" border="0" alt="" /></span></a><br />
<a class="info"><img src="http://i25.servimg.com/u/f25/11/25/40/17/alexa10.png" border="0" alt="" /><span><img src="http://i25.servimg.com/u/f25/11/25/40/17/alexa10.png" border="0" alt="" /></span></a> <a class="info"><img src="http://i25.servimg.com/u/f25/11/25/40/17/six10.png" border="0" alt="" /><span><img src="http://i25.servimg.com/u/f25/11/25/40/17/six10.png" border="0" alt="" /></span></a>
</td>

<td rowspan="2" valign="top">

<span class="onglet_0 onglet" id="onglet_drh" onmouseover="javascript:change_onglet('drh');">En Jeu</span>
<span class="onglet_0 onglet" id="onglet_drh1" onmouseover="javascript:change_onglet('drh1');">Actus</span>
<span class="onglet_0 onglet" id="onglet_drh2" onmouseover="javascript:change_onglet('drh2');">Credits</span>

<div class="contenu_onglet_PA" id="contenu_onglet_drh"><div align="center">
<br>
<table border="0">
<tr>
   <td width="85%">
   résumé/contexte
   </td>
   <td width="15%" valign="middle" align="center">
   <font size="3"><a href="http://sevensinscity.superforum.fr/t6-reglement-du-forum" class="postlink" target="_blank">Réglement</a><br />
   <a href="http://sevensinscity.superforum.fr/t5-contexte" class="postlink" target="_blank">Contexte</a><br />
   <a href="http://sevensinscity.superforum.fr/t3-les-groupes" class="postlink" target="_blank">Groupes</a><br />
   <a href="http://sevensinscity.superforum.fr/postes-vacants-f4/" class="postlink" target="_blank">PV</a><br />
   <a href="http://sevensinscity.superforum.fr/se-rappocher-de-l-enfer-f27/nos-partenaires-t28.htm" class="postlink" target="_blank">Nos Amis</a><br />
   <a href="http://sevensinscity.superforum.fr/questions-et-suggestions-f19/" class="postlink" target="_blank">Coin Invités</a><br /></font>
   </td>
</tr>
</table></div></div>


<div class="contenu_onglet_PA" id="contenu_onglet_drh1" style="display:none;"><div align="center">
<br>Contenu onglet 2</div></div>


<div class="contenu_onglet_PA" id="contenu_onglet_drh2" style="display:none;"><div align="center">
<br>Contenu onglet 3</div></div>

</td>

<td height="230" width="130" valign="top">
<div class="titres">VOTEZ !</div><br /><br />
   <div style="font-size:21px; text-align:center;"><a href="http://www.root-top.com/topsite/velusia/in.php?ID=4253" class="postlink" target="_blank">[1]</a> <a href="http://www.root-top.com/topsite/cherry23/in.php?ID=4933" class="postlink" target="_blank">[2]</a> <br /><br /> <a href="http://www.root-top.com/topsite/blueberry/in.php?ID=2817" class="postlink" target="_blank">[3]</a>
<a href="http://www.root-top.com/topsite/odealavie/in.php?ID=649" class="postlink" target="_blank">[4]</a> <br /><br /> <a href="http://www.root-top.com/topsite/candymiam/in.php?ID=5196" class="postlink" target="_blank">[5]</a></div>
</td>
</tr>

<tr>
<td rowspan="2" valign="bottom">
<div style="font-size:10px;">@SevenSinsCity. Toute reproduction partielle ou totale interdite</div>
</td>

<td rowspan="2" width="100" align="right">
   <div class="titres">NOS AMIS</div><br /><br />
<marquee direction="up" scrollamount="2" height="230" width="100"><a href="http://eternalis.jdrforum.com/forum.htm" class="postlink" target="_blank" rel="nofollow"><img src="http://i76.servimg.com/u/f76/11/66/39/15/eterna10.png" border="0" alt="" /></a> <a href="http://auxportesdelenfer.forumotion.com" class="postlink" target="_blank" rel="nofollow"><img src="http://i65.servimg.com/u/f65/11/25/40/17/logo410.png" border="0" alt="" /></a>
<a href="http://csi-la.forumpro.fr" class="postlink" target="_blank" rel="nofollow"><img src="http://i53.tinypic.com/30j4js2.jpg" border="0" alt="" /></a> <a href="http://a-new-beginning.forumactif.com" class="postlink" target="_blank"><img src="http://i65.servimg.com/u/f65/11/25/40/17/anb_lo13.png" border="0" alt="" /></a> <a href="http://nomoredrama.forumactif.org/forum"><img src="http://i56.tinypic.com/2n0slg0.jpg" border="0" alt="" /></a> <a href="http://earth-playground.forumactif.org/forum.htm" class="postlink" target="_blank"><img src="http://i687.photobucket.com/albums/vv240/Manoucha/Logo-v5-1.jpg" alt="" border="0"></a> <a href="http://asaria.forumpro.fr" class="postlink" target="_blank"><img src="http://nsa07.casimages.com/img/2009/04/25/090425023846653662.png" alt="" border="0"></a> <a href="http://eat-my-neighbors.forumactif.com" class="postlink" target="_blank"><img src="http://moe.mabul.org/up/moe/2010/07/18/img-225208tbjmu.gif" alt="" border="0"></a> <a href="http://terra616.nextgenforum.com/forum.htm" class="postlink" target="_blank"><img src="http://i35.servimg.com/u/f35/11/95/83/61/terra-12.jpg" border="0" alt="" /></a> <a href="http://nomansland-original.forumactif.com/forum.htm" class="postlink" target="_blank"><img src="http://i65.servimg.com/u/f65/11/25/40/17/no_man21.png" border="0" alt="" /></a> <a href="http://morsmordre.forums-actifs.com/" class="postlink" target="_blank"><img src="http://i56.tinypic.com/1zqeqa9.jpg" border="0" alt="" /></a> <a href="http://sherlock-21-century.forumactif.com/forum.htm" class="postlink" target="_blank"><img src="http://img641.imageshack.us/img641/6498/iconshbakerstreet.png" border="0" alt="" /></a> </marquee>
</td>
</tr>

<tr>
<td height="150" align="center" valign="top">
<div class="titres">ON LES RECHERCHE</div><br />
<img src="http://i51.tinypic.com/2ngy1c5.jpg" width="50" height="50" border="0" /> <img src="http://i51.tinypic.com/2ngy1c5.jpg" width="50" height="50" border="0" /> <img src="http://i51.tinypic.com/2ngy1c5.jpg" width="50" height="50" border="0" /> <img src="http://i51.tinypic.com/2ngy1c5.jpg" width="50" height="50" border="0" /> <img src="http://i51.tinypic.com/2ngy1c5.jpg" width="50" height="50" border="0" /> <img src="http://i51.tinypic.com/2ngy1c5.jpg" width="50" height="50" border="0" /> <img src="http://i51.tinypic.com/2ngy1c5.jpg" width="50" height="50" border="0" />
   <br /><br />
   <a href="http://best-rpg.forumpro.fr" target="_blank"><img src="http://i42.tinypic.com/5nk9s2.jpg" title="Best RPG, le site de référencement d’RPGs" alt="Best RPG, le site de référencement d’RPGs"></a>
</td>
</tr>
</table>

<script type="text/javascript">
//
</script>

</body></html>

Le QEEL :

Code:: 

<div class="gensmall">

<script type="text/javascript">
//
function MM_swapImgRestore() { http://v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { http://v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { http://v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { http://v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
</script>



<table>
<tr>
<td colspan="2" align="center">
<span class="onglet_1" id="onglet_pnj" onmouseover="javascript:change_onglet_qeel('pnj');"><font color="#aeb4cc">[ PNJ ]</font></span>
<span class="onglets_0" id="onglet_shadow" onmouseover="javascript:change_onglet_qeel('shadow');"> <font color="#7a3d3d">[ Shadow Company ]</font></span>
<span class="onglets_0" id="onglet_amazones" onmouseover="javascript:change_onglet_qeel('amazones');"> <font color="#878784">[ Amazones ]</font></span>
<span class="onglets_0" id="onglet_geishas" onmouseover="javascript:change_onglet_qeel('geishas');"> <font color="#d18acc">[ Geishas ]</font></span>
<span class="onglets_0" id="onglet_bushido" onmouseover="javascript:change_onglet_qeel('bushido');"> <font color="#154c9c">[ Bushido ]</font></span>
<span class="onglets_0" id="onglet_mercenaires" onmouseover="javascript:change_onglet_qeel('mercenaires');"> <font color="#cf0000">[ Mercenaires ]</font></span>
<span class="onglets_0" id="onglet_makarov" onmouseover="javascript:change_onglet_qeel('makarov');"> <font color="#bce03e">[ Makarov ]</font></span>
<span class="onglets_0" id="onglet_civils" onmouseover="javascript:change_onglet_qeel('civils');"> <font color="#d16c00">[ Civils ]</font></span>
<span class="onglets_0" id="onglet_police" onmouseover="javascript:change_onglet_qeel('police');"> <font color="#8ad17a">[ Police ]</font></span>
</td>
</tr>

<tr>
<td>
<div class="message">
<br/><br/>

<div id="contenu_onglet_pnj">
<div class="cadre"><br/><div style="margin:auto;text-align:center;width:100%"><img src="http://images4.fanpop.com/image/photos/16300000/Rose-rose-mcgowan-16313728-100-100.jpg" height=50 width=50> <img src="http://images4.fanpop.com/image/photos/16300000/Rose-rose-mcgowan-16313728-100-100.jpg" height=50 width=50></div>
<div style="text-align:justify; padding:10px;">PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ PNJ</div>
<br/></div>
</div>


<div id="contenu_onglet_shadow" style="display: none;">
<div class="cadre"><br/><div style="margin:auto;text-align:center;width:100%"><img src="http://img24.imageshack.us/img24/2715/icoavery.jpg" height=50 width=50> <img src="http://img24.imageshack.us/img24/2715/icoavery.jpg" height=50 width=50></div>
<div style="text-align:justify; padding:10px;">Les membres de la Shadow Company sont des militaires. A l'image des Rangers, des Delta Force... La SC et une unité secrète pour ne pas dire fantôme. Leurs mission sont bien précises (assasinat, torture, sabotage...) et viennent de très haut. Elle est composé des meilleurs des meilleurs des armées Américaine comme Française, Allemande... Ils sont à la pointe de la technologie est leur mission à Seven Sins City est plus que nécessaire.</div>
<br/></div>
</div>


<div id="contenu_onglet_amazones" style="display: none;">
<div class="cadre"><br/><div style="margin:auto;text-align:center;width:100%"><img src="http://images4.fanpop.com/image/photos/14700000/AS-PAIGE-rose-mcgowan-14709932-100-100.jpg" height=50 width=50> <img src="http://images4.fanpop.com/image/photos/14700000/AS-PAIGE-rose-mcgowan-14709932-100-100.jpg" height=50 width=50></div>
<div style="text-align:justify; padding:10px;">Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones Amazones</div>
<br/></div>
</div>


<div id="contenu_onglet_geishas" style="display: none;">
<div class="cadre"><br/><div style="margin:auto;text-align:center;width:100%"><img src="http://images2.fanpop.com/image/photos/13200000/mcgowan-rose-mcgowan-13226432-100-100.jpg" height=50 width=50> <img src="http://images2.fanpop.com/image/photos/13200000/mcgowan-rose-mcgowan-13226432-100-100.jpg" height=50 width=50></div>
<div style="text-align:justify; padding:10px;">Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas Geishas</div>
<br/></div>
</div>


<div id="contenu_onglet_bushido" style="display: none;">
<div class="cadre"><br/><div style="margin:auto;text-align:center;width:100%"><img src="http://images2.fanpop.com/image/photos/13200000/mcgowan-rose-mcgowan-13226418-100-100.jpg" height=50 width=50> <img src="http://images2.fanpop.com/image/photos/13200000/mcgowan-rose-mcgowan-13226418-100-100.jpg" height=50 width=50></div>
<div style="text-align:justify; padding:10px;">Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido Bushido</div>
<br/></div>
</div>


<div id="contenu_onglet_mercenaires" style="display: none;">
<div class="cadre"><br/><div style="margin:auto;text-align:center;width:100%"><img src="http://images2.fanpop.com/image/photos/13200000/mcgowan-rose-mcgowan-13226423-100-100.jpg" height=50 width=50> <img src="http://images2.fanpop.com/image/photos/13200000/mcgowan-rose-mcgowan-13226423-100-100.jpg" height=50 width=50></div>
<div style="text-align:justify; padding:10px;">Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires Mercenaires</div>
<br/></div>
</div>


<div id="contenu_onglet_makarov" style="display: none;">
<div class="cadre"><br/><div style="margin:auto;text-align:center;width:100%"><img src="http://images2.fanpop.com/image/photos/13200000/r-m-rose-mcgowan-13226326-100-100.jpg" height=50 width=50> <img src="http://images2.fanpop.com/image/photos/13200000/r-m-rose-mcgowan-13226326-100-100.jpg" height=50 width=50></div>
<div style="text-align:justify; padding:10px;">Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov Makarov</div>
<br/></div>
</div>


<div id="contenu_onglet_civils" style="display: none;">
<div class="cadre"><br/><div style="margin:auto;text-align:center;width:100%"><img src="http://images2.fanpop.com/image/photos/13200000/r-m-rose-mcgowan-13226283-100-100.jpg" height=50 width=50> <img src="http://images2.fanpop.com/image/photos/13200000/r-m-rose-mcgowan-13226283-100-100.jpg" height=50 width=50></div>
<div style="text-align:justify; padding:10px;">Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils Civils</div>
<br/></div>
</div>


<div id="contenu_onglet_police" style="display: none;">
<div class="cadre"><br/><div style="margin:auto;text-align:center;width:100%"><img src="http://images2.fanpop.com/image/photos/11500000/Rose-McGowan-rose-mcgowan-11560169-100-100.jpg" height=50 width=50> <img src="http://images2.fanpop.com/image/photos/11500000/Rose-McGowan-rose-mcgowan-11560169-100-100.jpg" height=50 width=50></div>
<div style="text-align:justify; padding:10px;">Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police Police</div>
<br/></div>
</div>

</td>

<td style="text-align: center;" width="510px"><span class="gensmall"><span class="gensmall"><span id="delf">{TOTAL_USERS_ONLINE}</span><script type="text/javascript">document.getElementById('delf').innerHTML=document.getElementById('delf').innerHTML.replace(/utilisateur en ligne/,"personne en Enfer");</script><script type="text/javascript">document.getElementById('delf').innerHTML=document.getElementById('delf').innerHTML.replace(/utilisateurs en ligne/,"personnes en Enfer");</script><script type="text/javascript">document.getElementById('delf').innerHTML=document.getElementById('delf').innerHTML.replace(/Enregistré/,"Citadin");</script><script type="text/javascript">document.getElementById('delf').innerHTML=document.getElementById('delf').innerHTML.replace(/Enregistrés/,"Citadins");</script><script type="text/javascript">document.getElementById('delf').innerHTML=document.getElementById('delf').innerHTML.replace(/Invisible et/,"Fantôme,");</script><script type="text/javascript">document.getElementById('delf').innerHTML=document.getElementById('delf').innerHTML.replace(/Invisibles et /,"Fantômes");</script><script type="text/javascript">document.getElementById('delf').innerHTML=document.getElementById('delf').innerHTML.replace(/Invité/,"Ame Errante");</script><script type="text/javascript">document.getElementById('delf').innerHTML=document.getElementById('delf').innerHTML.replace(/Invités/,"Ames Errantes");</script></span><br /><br />
{RECORD_USERS}<br />
<br />
{LOGGED_IN_USER_LIST}</span>
</td>
</tr>

<tr>
<td colspan="2"><br/><br/>
<div style="text-align:justify;width:100%;">{L_CONNECTED_MEMBERS}</div>
<td>
</tr>
</table>

<script type="text/javascript">
//
</script>

Le CSS pour le tout :

Code:: /* QEEL */

.onglets_0 {

font-family : verdana;
font-weight : bold;
text-align : center;
color : #3D4952;
}

/*.onglet_1 {

font-family : verdana;
font-weight : bold;
text-align : center;
color : #3D4952;
}
*/

.message {
font-family : verdana;
text-align : center;
color : #3D4952;
}

.cadre {
background-color : #172956;
width : 360px;
height : 190px;
-moz-border-radius-topleft : 40px;
-moz-border-radius-bottomright : 40px;
font-size : 11px;
font-color : #000000;
border : #2c5d5d 1px solid;
}

/* Message d'Accueil */

.onglet{
color                   : #000000;
font-size                : 14px;
background-image          : url(http://i53.tinypic.com/108ixig.png);
display                   : inline-block;
letter-spacing             : 3px;
width                   : 110px;
height                   : 50px
border-top                : 1px solid #3F484D;
border-left                : 1px solid #3F484D;
border-right             : 1px solid #3F484D;
text-align                : center;
text-shadow                : 0 0 15px #e0d6b7;
}

.contenu_onglet_PA{
background-image          : url(http://i52.tinypic.com/2zsvfqq.png);
background-repeat          : repeat;
margin-top                : 0px;
margin-bottom             : 5px;
margin-right             : 2px;
margin-left                : 2px;
padding-left             : 15px;
padding-right             : 15px;
padding-top                : 10px;
padding-bottom             : 10px;
font-size                : 12px;
height                   : 300px;
width                   : 470px;
overflow                : auto;
-webkit-border-radius       : 20px 20px 20px 20px;
text-align                : justify;
border-top                : 3px dashed #a29e9f;
}

.titres{
background-color          : #e29264;
-moz-border-radius-topright    : 10px;
-moz-border-radius-bottomleft : 10px;
font-size                : 14px;
text-align             : center;
width                   : 100%;
}

* {
font-family: Tahoma, Verdana, Arial, serif, Georgia, Courier New;

}
a.info {
position: relative;
color: #576186;
text-decoration: none;
}

a.info span {
display: none; /* on masque l'infobulle */
font-size: 12px;

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

cursor: help; /* on change le curseur par défaut en curseur d'aide */
}
a.info:hover span {
display: inline; /* on 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: 0px; /* on positionne notre infobulle */
left: 40px;

background: #C0CDE5;

color: #576186;
padding: 3px;

border: 3px solid #3E3D70;
}

Demain, je devrais avoir accès au net, mais je dois m'occuper du design de mon fo' alors comptez pas trop sur moi, et après c'est téléphone portable...

Veux pas aller en stage :'(

Amusez-vous bien^^

Bouh !

J'ai commencée à mettre en place le design sur mon forum de test histoire de tout calibrer. J'ai également modifié un peu la bannière car la typo était à vomir et puis le fond en bas ben j'aimais pas ! Alors j'ai fais un truc qui la rend un peu plus dynamique et franchement maintenant je la trouve mieux !

Par contre Ian, j'ai cru voir un bug sur la PA ><
Quand on passe sur les onglets, il change, mais tu peux passer qu'une seule fois ! après impossible de retourner sur les autres onglets. Je sais pas si ça vient de chez moi ou si c'est vraiment un bug !
Si c'est vraiment un bug, si tu trouves pas la parade, ben faudra abandonner les onglets ?

Edit : Je viens de voir, que la PA fait faire des blagues au QEEL ! Zut !!!!!!!!!

Edit 2 : Le lien de mon fow de test pour voir tout ça http://testgraphnono.forumperso.com/

Bah faut virer les onglets de l'un des deux à ce moment là, non ?

Sinon, la typo est vachement mieux comme ça, j'aime vraiment bien !

Ah, et ptite question, on est bien sûrs qu'on est 6 à rester dans le staff ?

C'est pas le bon code pour la PA. T'avais bien tout changé ?

Code:: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr" dir="ltr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<script type="text/javascript">
//
</script>

</head>
<body>

<table width="800" height="528" cellspacing="10" style="background-image:url(http://img11.hostingpics.net/pics/437497sscpa4.png); repeat:no-repeat;" border="0">
<tr>
<td height="230" width="130" valign="top">
<div class="titres">A VOTRE SERVICE</div><br /><br />
<a class="info"><img src="http://i25.servimg.com/u/f25/11/25/40/17/josh10.png" border="0" alt="" /><span><img src="http://i25.servimg.com/u/f25/11/25/40/17/josh10.png" border="0" alt="" /></span></a> <a class="info"><img src="http://i25.servimg.com/u/f25/11/25/40/17/alona10.png" border="0" alt="" /><span><img src="http://i25.servimg.com/u/f25/11/25/40/17/alona10.png" border="0" alt="" /></span></a><br />
<a class="info"><img src="http://i25.servimg.com/u/f25/11/25/40/17/sam10.png" border="0" alt="" /><span><img src="http://i25.servimg.com/u/f25/11/25/40/17/sam10.png" border="0" alt="" /></span></a> <a class="info"><img src="http://i25.servimg.com/u/f25/11/25/40/17/ian10.png" border="0" alt="" /><span><img src="http://i25.servimg.com/u/f25/11/25/40/17/ian10.png" border="0" alt="" /></span></a><br />
<a class="info"><img src="http://i25.servimg.com/u/f25/11/25/40/17/alexa10.png" border="0" alt="" /><span><img src="http://i25.servimg.com/u/f25/11/25/40/17/alexa10.png" border="0" alt="" /></span></a> <a class="info"><img src="http://i25.servimg.com/u/f25/11/25/40/17/six10.png" border="0" alt="" /><span><img src="http://i25.servimg.com/u/f25/11/25/40/17/six10.png" border="0" alt="" /></span></a>
</td>

<td rowspan="2" valign="top">

<span class="onglet_0 onglet" id="onglet_drh" onmouseover="javascript:change_onglet('drh');">En Jeu</span>
<span class="onglet_0 onglet" id="onglet_drh1" onmouseover="javascript:change_onglet('drh1');">Actus</span>
<span class="onglet_0 onglet" id="onglet_drh2" onmouseover="javascript:change_onglet('drh2');">Credits</span>

<div class="contenu_onglet_PA" id="contenu_onglet_drh"><div align="center">
<br>
<table border="0">
<tr>
   <td width="85%">
   résumé/contexte
   </td>
   <td width="15%" valign="middle" align="center">
   <font size="3"><a href="http://sevensinscity.superforum.fr/t6-reglement-du-forum" class="postlink" target="_blank">Réglement</a><br />
   <a href="http://sevensinscity.superforum.fr/t5-contexte" class="postlink" target="_blank">Contexte</a><br />
   <a href="http://sevensinscity.superforum.fr/t3-les-groupes" class="postlink" target="_blank">Groupes</a><br />
   <a href="http://sevensinscity.superforum.fr/postes-vacants-f4/" class="postlink" target="_blank">PV</a><br />
   <a href="http://sevensinscity.superforum.fr/se-rappocher-de-l-enfer-f27/nos-partenaires-t28.htm" class="postlink" target="_blank">Nos Amis</a><br />
   <a href="http://sevensinscity.superforum.fr/questions-et-suggestions-f19/" class="postlink" target="_blank">Coin Invités</a><br /></font>
   </td>
</tr>
</table></div></div>


<div class="contenu_onglet_PA" id="contenu_onglet_drh1" style="display:none;"><div align="center">
<br>Contenu onglet 2</div></div>


<div class="contenu_onglet_PA" id="contenu_onglet_drh2" style="display:none;"><div align="center">
<br>Contenu onglet 3</div></div>

</td>

<td height="230" width="130" valign="top">
<div class="titres">VOTEZ !</div><br /><br />
   <div style="font-size:21px; text-align:center;"><a href="http://www.root-top.com/topsite/velusia/in.php?ID=4253" class="postlink" target="_blank">[1]</a> <a href="http://www.root-top.com/topsite/cherry23/in.php?ID=4933" class="postlink" target="_blank">[2]</a> <br /><br /> <a href="http://www.root-top.com/topsite/blueberry/in.php?ID=2817" class="postlink" target="_blank">[3]</a>
<a href="http://www.root-top.com/topsite/odealavie/in.php?ID=649" class="postlink" target="_blank">[4]</a> <br /><br /> <a href="http://www.root-top.com/topsite/candymiam/in.php?ID=5196" class="postlink" target="_blank">[5]</a></div>
</td>
</tr>

<tr>
<td rowspan="2" valign="bottom">
<div style="font-size:10px;">@SevenSinsCity. Toute reproduction partielle ou totale interdite</div>
</td>

<td rowspan="2" width="100" align="right">
   <div class="titres">NOS AMIS</div><br /><br />
<marquee direction="up" scrollamount="2" height="230" width="100"><a href="http://eternalis.jdrforum.com/forum.htm" class="postlink" target="_blank" rel="nofollow"><img src="http://i76.servimg.com/u/f76/11/66/39/15/eterna10.png" border="0" alt="" /></a> <a href="http://auxportesdelenfer.forumotion.com" class="postlink" target="_blank" rel="nofollow"><img src="http://i65.servimg.com/u/f65/11/25/40/17/logo410.png" border="0" alt="" /></a>
<a href="http://csi-la.forumpro.fr" class="postlink" target="_blank" rel="nofollow"><img src="http://i53.tinypic.com/30j4js2.jpg" border="0" alt="" /></a> <a href="http://a-new-beginning.forumactif.com" class="postlink" target="_blank"><img src="http://i65.servimg.com/u/f65/11/25/40/17/anb_lo13.png" border="0" alt="" /></a> <a href="http://nomoredrama.forumactif.org/forum"><img src="http://i56.tinypic.com/2n0slg0.jpg" border="0" alt="" /></a> <a href="http://earth-playground.forumactif.org/forum.htm" class="postlink" target="_blank"><img src="http://i687.photobucket.com/albums/vv240/Manoucha/Logo-v5-1.jpg" alt="" border="0"></a> <a href="http://asaria.forumpro.fr" class="postlink" target="_blank"><img src="http://nsa07.casimages.com/img/2009/04/25/090425023846653662.png" alt="" border="0"></a> <a href="http://eat-my-neighbors.forumactif.com" class="postlink" target="_blank"><img src="http://moe.mabul.org/up/moe/2010/07/18/img-225208tbjmu.gif" alt="" border="0"></a> <a href="http://terra616.nextgenforum.com/forum.htm" class="postlink" target="_blank"><img src="http://i35.servimg.com/u/f35/11/95/83/61/terra-12.jpg" border="0" alt="" /></a> <a href="http://nomansland-original.forumactif.com/forum.htm" class="postlink" target="_blank"><img src="http://i65.servimg.com/u/f65/11/25/40/17/no_man21.png" border="0" alt="" /></a> <a href="http://morsmordre.forums-actifs.com/" class="postlink" target="_blank"><img src="http://i56.tinypic.com/1zqeqa9.jpg" border="0" alt="" /></a> <a href="http://sherlock-21-century.forumactif.com/forum.htm" class="postlink" target="_blank"><img src="http://img641.imageshack.us/img641/6498/iconshbakerstreet.png" border="0" alt="" /></a> </marquee>
</td>
</tr>

<tr>
<td height="150" align="center" valign="top">
<div class="titres">ON LES RECHERCHE</div><br />
<img src="http://i51.tinypic.com/2ngy1c5.jpg" width="50" height="50" border="0" /> <img src="http://i51.tinypic.com/2ngy1c5.jpg" width="50" height="50" border="0" /> <img src="http://i51.tinypic.com/2ngy1c5.jpg" width="50" height="50" border="0" /> <img src="http://i51.tinypic.com/2ngy1c5.jpg" width="50" height="50" border="0" /> <img src="http://i51.tinypic.com/2ngy1c5.jpg" width="50" height="50" border="0" /> <img src="http://i51.tinypic.com/2ngy1c5.jpg" width="50" height="50" border="0" /> <img src="http://i51.tinypic.com/2ngy1c5.jpg" width="50" height="50" border="0" />
   <br /><br />
   <a href="http://best-rpg.forumpro.fr" target="_blank"><img src="http://i42.tinypic.com/5nk9s2.jpg" title="Best RPG, le site de référencement d’RPGs" alt="Best RPG, le site de référencement d’RPGs"></a>
</td>
</tr>
</table>

<script type="text/javascript">
//
</script>

</body></html>

Code:: /* Message d'Accueil */

.onglet{
color                   : #000000;
font-size                : 14px;
background-image          : url(http://i53.tinypic.com/108ixig.png);
display                   : inline-block;
letter-spacing             : 3px;
width                   : 110px;
height                   : 50px
border-top                : 1px solid #3F484D;
border-left                : 1px solid #3F484D;
border-right             : 1px solid #3F484D;
text-align                : center;
text-shadow                : 0 0 15px #e0d6b7;
}

.contenu_onglet_PA{
background-image          : url(http://i52.tinypic.com/2zsvfqq.png);
background-repeat          : repeat;
margin-top                : 0px;
margin-bottom             : 5px;
margin-right             : 2px;
margin-left                : 2px;
padding-left             : 15px;
padding-right             : 15px;
padding-top                : 10px;
padding-bottom             : 10px;
font-size                : 12px;
height                   : 300px;
width                   : 470px;
overflow                : auto;
-webkit-border-radius       : 20px 20px 20px 20px;
text-align                : justify;
border-top                : 3px dashed #a29e9f;
}

.titres{
background-color          : #e29264;
-moz-border-radius-topright    : 10px;
-moz-border-radius-bottomleft : 10px;
font-size                : 14px;
text-align             : center;
width                   : 100%;
}

* {
font-family: Tahoma, Verdana, Arial, serif, Georgia, Courier New;

}
a.info {
position: relative;
color: #576186;
text-decoration: none;
}

a.info span {
display: none; /* on masque l'infobulle */
font-size: 12px;

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

cursor: help; /* on change le curseur par défaut en curseur d'aide */
}
a.info:hover span {
display: inline; /* on 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: 0px; /* on positionne notre infobulle */
left: 40px;

background: #C0CDE5;

color: #576186;
padding: 3px;

border: 3px solid #3E3D70;
}

Ouf c'est bon !!!!
Putain mais je suis pas doué !!! Frappé moi !!! Allé lynchez moi ! J'avais oubliée de mettre le CSS

*Va se cacher tout honteuse ><

Et pour le Staff, de sûr Logan va mourir ou partir.
Après je sais toujours pas si le vieux veut rester dans le Staff. On s'était un peu engueuler l'autre jour XD
Mais je lui redemanderai !

En attendant si vous voulez, vous pouvez trouver un gif pour votre personne, un gif plus grand que du 100*100. Logiquement les infobulles se retaille automatiquement. Donc vous êtes libre de choisir ce que vous voulez !

LOL Mais non on va pas te frapper... On t'aimeuh

Par contre, t'as changé le QEEL aussi ? Faut vraiment changer tous les codes...

Voilà pour mon icone :

Design Version 4 - Page 6 2f9f4624

J'ai remis les codes, mais le Queel chie un peu !
Je vais voir en remettant ton code dans la template, j'ai peux être pas le bon !

Je t'ai donné tous les codes qui marchent normalement à la page précédente. Il faut bien changer la PA, le QEEL ET le CSS. Tu changes tout.

Plop c'est bon !!!

C'est moi qui suis encore une fois polio !!! J'avais pas mis le nouveau code *SBAFF*

Pour le petit icon de l'infobulle, tu veux pas un tit gif Ian ? Comme tu veux ^^

Je voulais dire un truc mais je sais plus !!!

Ah oui !!!! Est-ce qu'on fait un petit changement de couleurs dans les groupes ? Histoire d'avoir un truc plus harmonieux ou je laisse

Je préfère une icône, pour que les filles aient le temps de baver sur ma belle gueule Razz

Pour les groupes, ca dépend si les couleurs passent ou non. Je suis pas pour changer si c pas indispensable. On a l'habitude avec ces couleurs, après faut tout retrouver c'est chiant.

Ben sur mon fow de test y a juste le jaune des Makarov qui passe pas bien et le vert de la police.

mais j'ai pas fixé la couleur de fond. J'aimerai juste savoir avant si vous aimez le fond ?

J'aime bien moi.

C'est vrai que tu peux foncer un peu pour les Makarov et la Police, mais en restant dans les mêmes tons.

*bave sur l'icone de Ian*

bref, reprenons nous.

Euh, j'vais passer pour une relou, sur la PA, mais j'ai une question : pkoi est-ce que le défilement des partenaires déborde le bas du cadre ?

Sinon, pour le fond du fo', tu comptes mettre ça comme couleur ? Perso j'aime moyen, j'aurais bien vu une teinte moins violine et plus rouge (même si ça reste dans des pastels), genre une teinte plus claire dérivée de ta ligne courbe du bas....

Sinon, le texte et les cadres du fo' restent en bleu finalement ?

Quant aux groupes, ça pourrait être pas mal d'adapter un peu leurs couleurs à l'ambiance, mais ça, à la limite, on peut le faire après la mise en place du design.

Non Alona, y aura pas de bleu, j'ai juste touché au fond !
J'ai rien fais d'autre encore XD

Pour la PA, je peux pas répondre, faut voir avec Ian !
Pense toi aussi à choisir un gif. Quand vous l'avez fait envoyé le moi via MP et/ou posté le dans le premier post de ce sujet (que je m'y retrouve plus facilement ^^)

Ah d'accord, je me disais, mais en tout cas ça me va. Si tu veux, ce weekend j'aurai du temps je pense, je pourrai faire le remplissage de la PA Smile

(faudra ptêt que j'ai accès au fo' test éventuellement si tu veux bien)

sinon, je sais pas où trouver un bon gif de Jessica Stroup....

ah et pour l'infobulle, est-ce que t'as rajouté un code Ian ? Parce qu'on a déjà des infobulles sur le fo' ici qui sont paramétrées dans le CSS, donc ya qu'à changer les couleurs et ptêt pas besoin de remettre tout un code....

Sinon, sur leur contenu, on pourra mettre le gif et le statut et le lien mp du staff à chaque fois, ptêt, histoire que ça soit plus clair, nan ?

» Design Version 1
» Design Version 3
» Design Version 5
» Design V2
» Design V2 by Nono

Rechercher

Résultats par : Messages Sujets
Recherche avancée