12,00

Tuto Créer un portfolio filtrable avec historique de navigation avec jQuery, Photoshop, CSS

12,00

  • Une formation vidéo de 2h16m
  • Téléchargement immédiat et visionnage illimité à vie
  • Satisfait ou remboursé
  • Fichiers sources inclus
Créer un portfolio filtrable avec historique de navigation

ajouter ce cours aux favoris retirer ce cours des favoris

Dans ce tuto vidéo PHOTOSHOP, HTML5, CSS3 et JQUERY nous allons voir comment créer un portfolio filtrable avec un historique de navigation. Les photos/projets qui seront triés dans le portfolio auront une hauteur variable et grâce à la puissance de Jquery, tous se replaceront au bon endroit pour ne laisse aucun espace vide. On mettra en place un petit bouton qui permettra de cacher/montrer le header du site.
Grâce à de nouvelles propriétés CSS3, nous mettrons facilement les images en noir & blanc et nous ferons bouger l'échelle de celles-ci. Nous ajouterons un système de filtre avec plusieurs catégories grâce à des animations fluides.
Et enfin, nous verrons comment ajouter un historique de navigation pour que les filtres appliqués soit gardés en mémoire et que l'internaute puisse revenir en arrière ou mettre en favoris une catégorie sélectionnée.

Sommaire de la formation

  • Partie 1 : Création du design sur Photoshop
  • Partie 2 : Découpage des images & Intégration du header
  • Partie 3 : Intégration & Développement du portfolio

Je vous invite à regarder l'extrait personnalisé que j'ai réalisé pour vous rendre compte de ce que l'on va obtenir ensemble à la fin de ce tutoriel. Le PSD ainsi que les fichiers HTML, CSS, & JQUERY sont fournis avec la formation.
Bon tuto !

Table des matières de cette formation jQuery, Photoshop, CSS (durée : 2h16m)

    • Design sous Photoshop 00:40:29
    • Découpage de la maquette 00:42:17
    • Intégration et Développement 00:54:09



Formateur : Adrien Gazaix

Adrien Gazaix a publié 201 tutoriels et obtenu une note moyenne de 4,8/5 sur 62 946 tutoriels vendus. Adrien Gazaix est un formateur certifié tuto.com. Voir les autres formations de Adrien Gazaix

4,9
note moyenne

26
avis laissés
5 étoiles
24
4 étoiles
2
3 étoiles
0
2 étoiles
0
1 étoile
0
  • 5
    avis de didigaga laissé le 27/01/2015
    Merci mille fois pour ce tuto ! Moi qui suis complètement débutante, je n'ai eu aucun mal à l'appliquer à mon propre projet. Bravo
    "Hello! Si tu est débutante et que tu as tout compris c'est super pour toi et aussi pour moi car j'essaye d'être précis et aller lentement pour que tout le monde puisse suivre et ce n'est pas toujours facile. Merci de ton retour et bonne continuation ;)"

  • 5
    avis de romarinethym laissé le 30/12/2014
    Très bien expliqué ! J'apprécie beaucoup le petit bouton pour la disparition du menu. Bravo !

  • 5
    avis de amonaton laissé le 03/05/2014
    Hello Spykrew, j'ai un gros souci qui m'empêche d'avancer sur le tuto : "Designez et Intégrez un site onepage". Je t'écris par le biais de ce Tuto car je n'ai à ce jour aucune réponse concernant la question suivante : " Lorsque je change les images (vignettes) du slider > images rectangulaires > La div id="content_news" tronque la section class="single_news" sur firefox et chrome ?!!? exemple : fodor.serveqo.ws > site tests??J'ai beau bidouiller dans tous les sens...je ne trouve pas la solution... merci à toi !!!

  • Avec quelles versions de logiciels ce tuto est-il compatible ?
    jQuery , Photoshop CS5, CSS 3
  • Quel est le niveau requis pour suivre ce tuto ?
    débutant
accédez à plus de 1447 tuto gratuits


non, je ne veux pas me former gratuitement

voir notre politique de protection des données