Fiche de Pub Taupe
Suite à une demande de Moys voici une fiche de Pub avec transition pour les images du staff.
Je précise que l'arrière plan blanc correspond à mon forum.
Et le code :
HTML :
- Code:
<!DOCTYPE><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style>div.staff {width: 100px; height: 75px; margin: auto; overflow: hidden; display: inline-block; margin-left: 5px;} .staff img {position: relative; bottom: 75px; transition: all 0.5s; width: 100px; height: 75px;} .staff:hover img {bottom: 200px; transition: all 0.5s;} .txt_staff {color: #9c887d; font-size: 14px; text-align: justify; overflow: auto; width: 80px; height: 55px; padding: 10px;}</style></head><body>
<div style="width: 530px; padding: 10px; margin: auto; background: #F5F5F2;">
<img src="http://img15.hostingpics.net/pics/661225image791.jpg" style="width: 530px; height: 350px;" />
<br /><br />
<a href="Lien du forum" style="display: block; font-size: 35px; color: #9c887d; text-align: center;">Nom du forum</a>
<br />
<div style="width: 255px; display: inline-block; margin-right: 15px; background: #9c887d; height: 16px; color: #F5F5F2; font-size: 25px; text-align: center;">
<span style="position: relative; top: -6px;">Contexte</span>
</div>
<div style="width: 255px; display: inline-block; background: #9c887d; color: #F5F5F2; height: 16px; font-size: 25px; text-align: center;">
<span style="position: relative; top: -6px;">Informations</span>
</div>
<br />
<div style="width: 215px; height: 140px; overflow: auto; display: inline-block; padding-left: 20px; padding-right: 20px; color: #9c887d; font-size: 11px; text-align: justify; margin-right: 15px;">
Texte texte
</div>
<div style="width: 215px; height: 140px; overflow: auto; display: inline-block; padding-left: 20px; padding-right: 20px; color: #9c887d; font-size: 11px; text-align: justify;">
Texte texte <br />x membres connectés
</div>
<br />
<div style="width: 255px; display: inline-block; margin-right: 15px; background: #9c887d; color: #F5F5F2; height: 16px; font-size: 25px; text-align: center;">
<span style="position: relative; top: -6px;">Nouveautés</span>
</div>
<div style="width: 255px; display: inline-block; background: #9c887d; color: #F5F5F2; font-size: 25px; height: 16px; text-align: center;">
<span style="position: relative; top: -6px;">Staff</span>
</div>
<br />
<div style="width: 215px; height: 80px; overflow: auto; display: inline-block; padding-left: 20px; padding-right: 20px; color: #9c887d; font-size: 11px; text-align: justify; margin-right: 15px;">
Texte texte
</div>
<div style="width: 215px; height: 80px; overflow: auto; display: inline-block; padding-left: 20px; padding-right: 20px; color: #9c887d; font-size: 11px; text-align: justify;">
<div class="staff"><div class="txt_staff">Texte ici
</div><img src="http://img15.hostingpics.net/pics/219236image990.jpg" alt="staff" /></div>
<div class="staff"><div class="txt_staff">Texte ici
</div><img src="http://img15.hostingpics.net/pics/219236image990.jpg" alt="staff" /></div>
</div>
<br />
<div style="background: #9c887d; color: #F5F5F2; font-size: 25px; height: 16px; text-align: center;">
<span style="position: relative; top: -6px;">Nous lier</span>
</div>
<div style="color: #9c887d; font-size: 11px; text-align: justify; height: 80px; overflow: auto; padding: 15px;">
Texte texte texte
</div>
<a href="http://www.never-utopia.com" style="display: block; text-decoration: none; font-size: 11px; text-align: center; color: #9c887d;">A-Lice | Never-Utopia</a>
</div></body></html>
Le code est à mettre dans le panneau d'administration, dans Module -> HTML & JAVASCRIPT -> Gestion des pages HTML -> Création en mode avancé (HTML)
Et l'iframe pour poster :
- Code:
<center><iframe src="Lien de la page HTML" border="0" frameborder="0" scrolling="no" style="margin: 10px;" width="570px" height="900px"></iframe></center>
/!\ En cas de problème, c'est ici ou là que ça ce passe.