[Webdesign] Une navigation horizontale avec Coda Slider
Catégorie du billet : Créer son thème, Theme, Wordpress
Coda Slider est un script basé sur jQuery qui permet de facilement mettre en place une navigation horizontale pour votre site.

1/ Pourquoi mettre en place une navigation horizontale sur son site ?
Parce que c’est une des tendances actuelle du design de sites internet.
Voici 3 exemples de belles réalisations [Smashing Magazine]
- La plateforme de microblogging Plurk :
- Le plugin Piclens pour Firefox :
- D’autres sites tel que celui du webdesigner Dean Oakley :
2/ Une navigation horizontale, sans scroller
Comme vous pouvez le remarquer ces 3 exemples sont horizontaux mais avec scrolling. Il existe un autre type de navigation horizontale, celle ou le contenu reste centré sur la page mais ou les pages glisse ou “slide” horizontalement.
Le plus bel exemple que j’ai trouvé pour ce type de navigation est le thême WP-Coda pour Wordpress que nous présentait le Journal du Geek dans ce billet.
3/ Mais comment faire pour avoir la même chose ?
- “Simplement en téléchargeant le thême Wordpress WP-Coda si tu as un blog Wordpress (solution de facilité et très peu personnalisé)… Sinon en codant tout à la main comme un grand.”
- “Oui mais ca doit être difficile à mettre en place, non ?”
- “NON ! regarde en dessous tu as des liens pour trouver toutes les informations qu’il te faut !”
L’auteur du Thème WP-Coda nous donne toutes les ressources qu’il a utilisé pour sa réalisation, ca se trouve ici :
Je suis déjà en train de travailler sur un site personnel qui utilise Coda-Slider pour la navigation, j’utilise aussi dessus Unitip dont je vous parlais dans ce billet.
D’autres scripts sont ou seront utilisés dans ce site perso, je ferai des billets au fur et à mesure et vous devoilerai le tout quand ca sera prêt ! (bientôt c’est promis)
Article écrit le 20/08/2008 par Wanders51,
Un seul commentaire
1,045 vues
Laisser un commentaire !
N'hésiter pas à commenter ce billet, vos réactions et commentaires sont autant important que le billet lui même !!!
XHTML: Vous pouvez utiliser ces tags ! <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>






Ajouter à del.icio.us !
Twitter ce billet !











