GRATUIT : votre publicité sur des milliers de sites [ L'utile de l'unitile ] [Tuto]Auto-Redimension de l'image de fond selon la résolution
[ S’enregistrer ] [ FAQ ] [ Rechercher ] [ Connexion ]
[Tuto]Auto-Redimension de l'image de fond selon la résolution

 
Poster un nouveau sujet   Répondre au sujet    L'utile de l'unitile Index du Forum -> Informatique -> Les logiciels et la programmation
Sujet précédent :: Sujet suivant  
Auteur Message
Admin
Administrateur (-trice)

Hors ligne

Inscrit le: 18 Mar 2008
Messages: 116
Point(s): 48
Moyenne de points: 0,41

MessagePosté le: Ven 7 Nov - 20:24 (2008)    Sujet du message: [Tuto]Auto-Redimension de l'image de fond selon la résolution Répondre en citant

  • Titre: Auto-Redimension de l'image de fond selon la résolution d'écran
  • Version: 1.0
    http://xooit.xooit.com/t36944-Auto-Redimension-de-l-image-de-fond-selon-la-…


  • Contact : Ici dans ce topic
  • Source: d'après un topic sur sitepoint.com concernant le site ringvemedia.com

  • Description: image de fond fluide s'adaptant à toutes les tailles/résolutions d'écran
    l'image se redimensionne proportionnellement en fonction de la taille de la page
    l'image occupe tout le fond du forum quelque soit ça taille d'origine
    méthode qui permet également de mettre un fond en flash animé

  • Niveau d'installation: Moyen
  • Temps d'installation: 10 min
  • Nombre de template(s) à modifier : 2

  • Fonctionne sur les thèmes : apparemment tous après modification
  • Test(s) effectué(s) sur :Xooit, Phpbb,


  • Défaut(s) : à signaler
  • Exemple(s) : http://atlas.coolforum.info/index.php?theme=test (à voir l'exemple source sur ringvemedia.com)


>> Panneau d'administration
>> Thème
>> Modifier les templates


Ouvrir overall_header.tpl

Ajoutez avant </head> (à ne pas confondre avec <head>)
Code:


<style>
html,body{margin:0;padding:0;}
#bg,#bg table,#bg td{width:100%;height:100%}
#bg div{position:absolute;width:200%;height:200%;top:-50%;left:-50%}
#bg td{vertical-align:middle;text-align:center}
#bg img{min-height:50%;min-width:50%;margin:auto}
#main{position:absolute;top:0;left:0;z-index:10;width:100%;height:100%;margin:0;padding:0;}
div#bg {
  z-index: -3;
  left: 0;
  right: 0;
  margin: 0;
  padding: 0;
  position: fixed;
  top: 0;
  _position: absolute;
  top: expression(body.scrollTop + 0 + "px");
}
</style>






Ajoutez juste après <body>
Code:


<div id="bg">
<div>
<table cellpadding="0" cellspacing="0"><tr><td>
<img alt="" src="http://image-de-fond.jpg">
</td></tr></table>
</div>
</div>

<div id="main"> 




Remplacez dans ce code ci-dessus http://image-de-fond.jpg par l'adresse de votre image de fond


Seulement si vous avez ceci en première ligne de overall_header.tpl
Code:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">




Dans ce cas, Remplacez par
Code:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">






Ajoutez ceci à la fin de overall_header.tpl
Code:

<iframe name="google_ads_frame" src="" width="0" height="0" scrolling="no" frameborder="0" allowtransparency="true"></iframe>



(afin d'éviter que certains menus déroulants soient cachés par le fond,
une iframe invisible usant des paramètres de google_ads_frame, permet de corriger cela )


Sauvegarder et fermer


Ouvrir overall_footer.tpl

Ajoutez juste avant </body>
Code:


</div>





Sauvegardez et fermez




Fin du Tuto


Revenir en haut
Publicité






MessagePosté le: Ven 7 Nov - 20:24 (2008)    Sujet du message: Publicité

PublicitéSupprimer les publicités ?
Revenir en haut
Montrer les messages depuis:   
Poster un nouveau sujet   Répondre au sujet    L'utile de l'unitile Index du Forum -> Informatique -> Les logiciels et la programmation Toutes les heures sont au format GMT + 1 Heure
Page 1 sur 1

 
Sauter vers:  
GRATUIT : votre publicité sur des milliers de sites Dookie Template is created by Mo6
Powered by phpBB © 2001, 2015 phpBB Group
Traduction par : phpBB-fr.com
Portail | Index | Panneau d’administration | creer un forum | Forum gratuit d’entraide | Annuaire des forums gratuits | Signaler une violation | Conditions générales d'utilisation