PA One Piece Atarashii Jidai

Bonjour ou Bonsoir. Merci de vous occupez de cette commande

Adresse du forum : http://op-aj.forumgratuit.org/
Description des éléments :

Spoiler:

Couleurs ou tons : Couleur du forum, Gris et Noir.
Images : Noter sur le schéma, il ce fait tard, si j'ai oublier quelques chose dite le moi.
Autres précisions : Pouvez vous me rentré les infobulle directement dans le code et me donner le code css qui va avec ??

Toujours d'actu :)

Commande toujours d'actu !

Salut,

Je suis en train de bosser sur ton code et j'ai une question :)
Le "menu déroulant", c'est comme les TOP PARTENAIRES sur ce forum ?

Salut et merci de t'occuper de ma commande :)

Non, j’appelle menu déroulant, les images qui défile automatique comme ça :

Défilement !!



Voilà :)

Alors voilà la structure de ta page. Elle devrait être assez claire mais, si tu ne comprends pas quelque chose ou a du mal avec la personnalisation, demande moi :)

Code:

<table style="width: 100%"><tr><td colspan="12" style="background-color:#496e47; text-align: center; color: #e7f2e7;">Bienvenue {USERNAME}</td></tr>

<tr>
<td colspan="4" style="background-color:#698a67; width: 33%; padding: 6px; text-align:center; color: #1b2a1a;">Wanted



<table style="width: 50%; margin-left: auto; margin-right: auto; "><tr>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

</center></tr><tr>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

</tr><tr>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

</tr><tr>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

</tr></table>


<td colspan="4" style="background-color:#698a67; width: 33%; padding: 6px; text-align: justify; color: #1b2a1a;">contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte </td>

<td colspan="4" style="background-color:#698a67; width: 33%; padding: 6px; text-align: center; color: #1b2a1a;">Staff



<img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg" />  <img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg" />  <img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg" />  <br/ >

<img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg" />  <img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg" />  <img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg" />  <br/ >

<img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg" />  <img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg" />  <img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg" /> 

</td>

</td></tr>
<tr>

<td colspan="6" style="background-color:#496e47; width: 50%; padding: 6px;  text-align: center; color: #e7f2e7;">Top sites & partenaires


<marquee onmouseover="scrollstop()"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg"></marquee>


<marquee direction="right" onmouseover="scrollstop()"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg"></marquee></td>

<td colspan="6" style="background-color:#496e47; width: 50%; padding: 6px; text-align: center; color: #e7f2e7;">Top 3 wanted
 Top 3 réputation


<img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg" width="125" height="150"> <img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg" width="125" height="150"> <img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg" width="125" height="150"> <img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg" width="125" height="150"> <img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg" width="125" height="150"> <img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg" width="125" height="150">
</td>

</tr><tr>

<td colspan="12" style="background-color: #a8c3a7; width: 50%; padding: 6px;  text-align: center; color: #688c67;">page d'accueil © Never Utopia</td>

</table>

Et le CSS pour les infobulles :

Code:


.infobulle {
position: relative;
z-index: 0;
}

.infobulle:hover {
background-color: transparent;
z-index: 50;
}

.infobulle span {
position: absolute;
background-color: #000000;
padding: 5px;
left: -1000px;
visibility: hidden;
color: #FFFFFF;
}

.infobulle span img {
border: 2px;
padding: 5px;
}

.infobulle:hover span {
visibility: visible;
top: 70px;
left: 35px;
width: 200px ;
color:#FF0000;
border: 2px solid #0000FF;
}

Je te remercie C'est très bien, je pense pouvoir me débrouillé pour le reste

Encore merci :)

Edit => Je viens de voir que tu as oublier de mettre les infobulle pour le staff ^^"

Oups, désolée.

Code:

<table style="width: 100%"><tr><td colspan="12" style="background-color:#496e47; text-align: center; color: #e7f2e7;">Bienvenue {USERNAME}</td></tr>

<tr>
<td colspan="4" style="background-color:#698a67; width: 33%; padding: 6px; text-align:center; color: #1b2a1a;">Wanted



<table style="width: 50%; margin-left: auto; margin-right: auto; "><tr>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

</center></tr><tr>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

</tr><tr>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

</tr><tr>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

</tr></table>


<td colspan="4" style="background-color:#698a67; width: 33%; padding: 6px; text-align: justify; color: #1b2a1a;">contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte </td>

<td colspan="4" style="background-color:#698a67; width: 33%; padding: 6px; text-align: center; color: #1b2a1a;">Staff



<table style="width: 50%; margin-left: auto; margin-right: auto; "><tr>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

</tr><tr>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

<td><div class="infobulle"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg">
<span>Contenu de la bulle</span></div> </td>

</tr></table>

</td>

</td></tr>
<tr>

<td colspan="6" style="background-color:#496e47; width: 50%; padding: 6px;  text-align: center; color: #e7f2e7;">Top sites & partenaires


<marquee onmouseover="scrollstop()"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg"></marquee>


<marquee direction="right" onmouseover="scrollstop()"><img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg"></marquee></td>

<td colspan="6" style="background-color:#496e47; width: 50%; padding: 6px; text-align: center; color: #e7f2e7;">Top 3 wanted / Top 3 réputation <br /><br />


<img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg" width="125" height="150"> <img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg" width="125" height="150"> <img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg" width="125" height="150"> <img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg" width="125" height="150"> <img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg" width="125" height="150"> <img src="http://www.josephine.li/Boutons/Fond_noir_50_50_pixel_noir.jpg" width="125" height="150">
</td>

</tr><tr>

<td colspan="12" style="background-color: #a8c3a7; width: 50%; padding: 6px;  text-align: center; color: #688c67;">page d'accueil © Never Utopia</td>

</table>

Merci c'est parfait