Kory
{ Membre actif }
Messages : 370
| Barre de navigation accrochée en haut de la fenêtre Niveau: Facile | Par: Kory | Validé par: Hiro' | En date du: 28-02• Ce tutoriel ne s'applique qu'aux forums ForumActif en version phpbb2 • Vous devez être fondateur de votre forum pour éditer les templates
Bonjour (ou bonsoir).
Je vous laisse d'abord le résultat : ici.
- Première étape
Pour réaliser ce tutoriel, vous devez avoir votre barre de navigation au-dessus de votre bannière. Un tutoriel vous apprend comment faire ici. Arrêtez vous avant à la création de la class dans la feuille de CSS mais créez-la bien dans le template.
Arrêtez-vous après cette étape - Citation :
- Revenez dans votre template overall_header
Remplacer ce morceau de code : - Code:
-
<td align="{MENU_POSITION}"{MENU_NOWRAP}>{GENERATED_NAV_BAR}</td> </tr> </table><br> Par celui-ci : - Code:
-
<td align="{MENU_POSITION}"{MENU_NOWRAP}><span class="navi">{GENERATED_NAV_BAR}</span></td> </tr> </table><br>
- Deuxième étape
C'est ici que commence vraiment ce tutoriel. Prenez votre feuille de style et ajoutez-y ce code. Rien n'est à modifier, excepté le fixed par un absolute (voir plus bas) ou le width pour changer la largeur, rien d'autre. - Code:
-
.navi { position: fixed; left: 0px; top: 0px; right: 0px; z-index:1000; width: 100%; } Vous pouvez maintenant personnaliser votre barre de navigation et votre barre est désormais accrochée la fenêtre pour suivre le défilement de la page. Cependant si vous la voulez accrochée en haut de la page mais vous ne voulez pas qu'elle descende, remplacez fixed par absolute dans le CSS.
En espérant que ce tutoriel vous a servi et plu, Kory. |
Dernière édition par Kory le Sam 19 Fév 2011, 13:55, édité 4 fois | |
|
Kaiji
Blanche-Neige
Messages : 5578
| FAQ Pour toute question sur ce tutoriel, merci de poster une demande d'aide ici : http://www.css-actif.com/f17-aide-css-xhtml | | |
|
Edward Speleers
{ Spécialiste }
Messages : 1799
| Ce code marche vraiment super bien, merci mille fois, mon forum commence enfin à ressembler à quelque chose^^ | | |
|
mister monster
{ Membre }
Messages : 12
| par contre comment faire pour que la barre de navig soit comme dans ton exemple c'est a dire au dessus d'un fond de couleur transparent ? Comme ici aussi : http://justaddwater.forumperso.com/ | | |
|