Layouts – One Page Layout et Parallaxe

LEÇON PRATIQUE

 

onepagelayout-et-parallaxe-screenshotUtilisation de deux techniques dans la même page :

  • One Page Layout (side menu)
  • Parallaxe

 

One Page Layout Side Menu + Parallaxe

Page en ligne : Ouvrir

Code source (fichier ZIP) : Télécharger

 

Remarques :

  • Le code JavaScript / jQuery de la technique "One Page Layout" à été fusionner avec le code de la technique "Parallaxe" pour créer un seul fichier "onepage_parallax.js" qui sert de module réutilisable pour implémenter les deux techniques ensemble
  • Le code pour la technique "One Page Layout" a été rendu un peu plus générique et ce code est paramétrable via un nouveau conteneur nommé "onepageConfig"
  • Pour le plupart, le code pour les deux techniques reste relativement séparé (voir les commentaires dans le fichier "onepage_parallax.js") mais une fusion du code au niveau des évènements et nécessaire car on ne peut pas déclarer plusieurs fonctions à réagir suite au même évènement.