Dans ce tuto vidéo HTML5, CSS3 et jQuery, nous allons voir ensemble, pas à pas, comment intégrer un site One Page de A à Z. Un site One Page n'a pas de rechargement de page et toute la navigation se fait grâce à un scroll fluide entre chaque rubrique. A la fin de cette formation, vous serez en mesure de créer un site complet qui peut être mis en ligne tout de suite.

Je vous propose de regarder l'extrait personnalisé de 10 minutes que j'ai réalisé pour vous rendre compte de ce que l'on va apprendre dans cette formation de 4h30.

Sommaire de la formation :

  • Découpage des images dans Photoshop : technique de découpage, formats d'images à choisir, création de sprites
  • Mise en place d'un slider de plusieurs images sur le background en full page
  • Intégration de la sidebar : logo, menu, réseaux sociaux, copyright & un bouton permettant de la cacher/montrer
  • Création des 3 rubriques + mise en place du système one page avec scroll entre les rubriques
  • Intégration de la partie "News" : Carousel responsive, déploiement d'une nouvelle sidebar pour lire le contenu de la news sélectionnée
  • Intégration de la partie "About Us" : Colonnes CSS3, blockquote personnalisé
  • Intégration de la partir "Contact" : Formulaire 3 champs, google map
  • Développement du formulaire en Ajax/PHP avec test d'envoi sur une boîte email
  • Création d'un lecteur MP3 personnalisé en jQuery
  • Ajout d'interactions avec les touches du clavier (cacher tout le contenu du site et mettre le site en pause, puis l'inverse) & aussi quelques conseils pour mettre en ligne le site créé (logiciel FTP, hébergement)

TOUT le site est inclus dans les sources, ainsi que l'intégration de départ pour vous permettre de suivre la formation dans les meilleurs conditions et refaire petit à petit le site one page en même temps que vous regardez la vidéo.

Bon tuto !

Jetez un oeil à ces autres tuto HTML 5, CSS 3, jQuery 1.8

Créer une application autour de moi en HTML5Créer une application autour…
Dans ce tuto HTML5 en vidéo, nous allons voir comment créer…

Pack : Créer votre site Internet, les bases pour débutantsPack : Créer votre site Internet,…
Dans ce pack, nous allons vous donner toutes les bases HTML…

Aller plus loin en HTML5 : Le drag and dropAller plus loin en HTML5 :…
Gérez le glissé/déposé avec JavaScript Vous êtes développeur…

Création et montage HTML / CSS d'un thème E-CommerceCréation et montage HTML…
Nous allons apprendre à créer un thème de site qui pourra…

Montage HTML / CSS d'un site Internet ResponsiveMontage HTML / CSS d'un site…
Voici une formation sur le découpage et l'intégration d'un…

Créer un portfolio full responsive en HTML5 et CSS3Créer un portfolio full responsive…
Voici une formation pour apprendre à créer un portfolio full…

Administration en AJAX et HTML5Administration en AJAX et…
Dans ce tuto AJAX en vidéo, nous verrons comment ajouter, supprimer…

Montage HTML / CSS d'un site responsive en One PageMontage HTML / CSS d'un site…
Voici la suite de la formation consacrée à la création d'une…

Cette formation contient 10 leçons en vidéo pour une durée totale de 4h36.
Voici le programme complet abordé au cours de cette formation :

  • Découpage des images00:21:23 
  • Background full page00:14:06 
  • Sidebar mouvante00:46:41 
  • Mise en place contenu et pagescroller00:32:11 
  • Partie NEWS00:56:30 
  • Partie ABOUT US00:10:05 
  • Partie CONTACT00:18:12 
  • Formulaire Ajax/PHP00:31:15 
  • Lecteur MP3 en jQuery00:36:01 
  • Interactions touches clavier et mot de la fin00:09:46 

Pour vous faire un avis, voici un extrait de quelques secondes. La version complète et téléchargeable de ce tuto HTML 5, CSS 3, jQuery 1.8 de 4 heures 36 minutes est proposée dans une résolution plus grande que l’extrait suivant :

Partagez cet extrait

Lien vers cet extrait : Embed code :

spykrew07 , formateur certifié

Salut à tous ! Je m'apelle Adrien j’ai 29 ans et je suis Webdesigner spécialiste WordPress depuis 7 ans. Ancien élève de l'ESMA à Montpellier, j’ai travaillé en agence de communication pendant 4 ans et depuis 3 ans je me suis lancé en freelance. Formateur certifié sur tuto.com, je partage mes connaissances et mes découvertes dans différents domaines : web design, logo, html, wordpress, php, css jquery ... Ma devise : Webdesign is not a job, it’s a passion !

Toutes les formations de Spykrew07


Témoignage des clients de spykrew07

Je trouve que Spykrew07 est un très bon formateur !

Très bon formateur !!!

tutos clair et précis!

Très bien, de bonnes explications très précises. Un bon rythme pendant les tutos

Tuto utile et super précis ! Merci

Lire les autres témoignages

 

D'autres tuto de spykrew07

Créer une mini boutique ecommerce avec WordPress & PaypalCréer une mini boutique ecommerce avec WordPress & Paypal
Dans ce tuto vidéo, nous allons voir comment créer un mini site ecommerce pour vendre…

Créer un portfolio filtrable avec historique de navigationCréer un portfolio filtrable avec historique de navigation
Dans ce tuto vidéo PHOTOSHOP, HTML5, CSS3 et JQUERY nous allons voir comment créer…

Créer un badge simplementCréer un badge simplement
Dans ce tuto Illustrator, en vidéo, nous allons voir ensemble, pas à pas, comment créer…

Designer un site one page moderneDesigner un site one page moderne
Dans cette formation Photoshop en vidéo de 10 chapitres, nous allons voir, pas à pas,…

voir tous les tuto de spykrew07

Notes attribuées par les utilisateurs (49 votes)

Note moyenne des utilisateurs  

Votez pour ce tuto


 

Les avis / Questions des utilisateurs (187)

par spykrew07
(auteur de ce tuto - 20 février 2014)

" @badjo75 C'est super si tu as compris comment utiliser jQuery ;) Merci pour ton retour et à bientôt pour de nouveaux tuto ! "

par badjo75a voté :
(a acheté ce tuto - 18 février 2014)

" Merci pour ce tuto, très clair qui m'a enfin permis de comprendre comment utiliser jquery ! "

par christophe02600
(a acheté ce tuto - 09 février 2014)

" Bonjour,

Super tuto !
Cependant, j'ai repéré que le tuto avait été développer avec le navigateur " Google Chrome " , j'aimerais bien l'adapter pour Firefox et Internet Explorer .. je pense que c'est la base afin que tous les visiteurs du site web possèdent la même expérience ..

Pourriez-vous m'aider à corriger les différentes erreurs pour Firefox et IE ? Sa serait vraiment sympathique,
Sinon, a part ce point-là, le tutoriel est vraiment nickel. Bravo.

Cdlt Christophe. "

par spykrew07
(auteur de ce tuto - 07 janvier 2014)

" @ddups Ce n'est pas normal que la deuxième action jquery annule la précédente. Il doit y avoir une erreur quelque part. Dans ce tuto on écrit pas mal de jquery à la suite oui mais si tu n'as pas besoin de créer un site one page tu n'es pas obligé d'acheter cette formation. Regardes si ton code jquery est bien entre :

$(function() {

});

Bon courage ;) "

par ddups
(n'a pas acheté ce tuto - 07 janvier 2014)

" Oui. En utilisant plusieurs "code", plusieurs fonctions jQuery, j'ai un souci, car quand je met deux fonctions (un slider et un scroll), la première annule la deuxième. Est-ce que ce tutoriel pourrait m'aider à gérer ce type problème ? "

par spykrew07
(auteur de ce tuto - 02 janvier 2014)

" @ddups Je ne comprends pas ce que tu veux dire. Peux-tu me reformuler ta demande ? Merci ;) "

par ddups
(n'a pas acheté ce tuto - 02 janvier 2014)

" Apprend-on dans cette formation à gérer plusieurs codes Jquery ensemble ? Est-ce compris dans la formation ? "

par spykrew07
(auteur de ce tuto - 28 novembre 2013)

" @gmaingre Merci pour ton retour et ton vote ça fait plaisir ! Pour les versions de jQuery oui il peut arriver que dans les dernières versions certaines méthodes ou fonctions soient dépréciées et même supprimées malheureusement. Il faut donc soit garder une version de jquery anterieure (1.8 dans ce cas) soit mettre la dernière mais adapter le code pour que cela marche correctement.

Bonne continuation ;) "

par gmaingreta voté :
(a acheté ce tuto - 28 novembre 2013)

" Par contre j'ai eu le meme probleme que bluedevil avec le bouton Hide/Show qui disparaissait vers le haut, j'ai remarqué que c'était du à la référence à jQuery 1.10.2 au lieu de 1.8 "

par gmaingreta voté :
(a acheté ce tuto - 28 novembre 2013)

" Belle performance de réaliser ce site en 4h30 avec des explications claires en prime.

Merci pour la qualité de ce tuto! :) "

par mizuholuxa voté :
(a acheté ce tuto - 26 novembre 2013)

" tres tres tres tres bien merciiiiiiiiiiiiiiiiiiiiiiiiiiii "

par Mitsou
(n'a pas acheté ce tuto - 24 novembre 2013)

" oui bien sûr ça 'intéresse , mais pas seulement : j'aimerai bien animer la galerie de la formation que j'ai suivi dans mon dernier tuto sans passer par Wordpress . En fait finir le site sans Wordpress "

par spykrew07
(auteur de ce tuto - 24 novembre 2013)

" @Mitsou Si WordPress ne t'interesse pas tu peux celui-ci de tuto oui. Mais ne l'achète pas juste pour le formulaire de contact il faut que le système one page te serve à quelque chose. Si ça t’intéresse je peux faire un tuto pour créer un formulaire de contact en ajax/php. "

par Mitsou
(n'a pas acheté ce tuto - 22 novembre 2013)

" Bonjour Adrien.
J'ai suivi ta formation "Créer un site web Wordpress : l'intégration", mais je n'ai pas fait le tuto suivant dédié au Développement, puisque je ne me sert pas de Wordpress. Il me manque surtout l'envoi du formulaire de contact en Ajax/PHP.
Que me conseilles-tu : faire celui-ci qui m'intéresse ou continuer sur Tuto Créer un site WordPress : Développement ?
D'ailleurs, j'aimerai bien aussi un tuto pour l'intégration des typos ... "

par spykrew07
(auteur de ce tuto - 04 novembre 2013)

" @htmlene OK pas de soucis et bonne continuation ;) "

par htmlenea voté :
(a acheté ce tuto - 04 novembre 2013)

" @spykrew07
J'ai acheté ce tuto surtout pour le formulaire de contact, je t'avoue, c'est pour ça que j'ai été un peu déçue de prime abord. Mais globalement c'est un très bon tuto, je me ravise donc... il mérite amplement un 4,5/5. D'autant plus que tu es très réactif pour répondre aux questions. Merci à toi. "

par spykrew07
(auteur de ce tuto - 04 novembre 2013)

" @htmlene Non il n'y a pas de vérification de format d'email, juste la verif html5 mais tu peux la rajouter facilement côté PHP :

$email = hello[at]gmail.com;

if(filter_var($email, FILTER_VALIDATE_EMAIL)){
echo 'email ok !';
}

C'est pour cette raison que tu m'as mis une note de 3/5 ? "

par glancea voté :
(a acheté ce tuto - 30 octobre 2013)

" Merci pour cette réactivité!

Avec @font-face ça marche nickel. Problème résolu.

Merci Beaucoup "

par spykrew07
(auteur de ce tuto - 30 octobre 2013)

" @glance Oui Firefox est un peu pénible avec Cufon. Si c'est rédhibitoire pour toi tu peux supprimer Cufon et utiliser @font-face en CSS3 tu n'auras plus de problèmes normalement. Bonne continuation ! "

par glancea voté :
(a acheté ce tuto - 29 octobre 2013)

" Bonjour,

excellent tuto!!!

Question : Le H2 des news disparait, après avoir passer la souris sur la news sous firefox, ce problème n'est pas présent sous chrome. (le problème ne vient pas de mes codes, étant donné qu'en testant le fichier source le problème est tout de même présent, uniquement sous firefox.)

Comment peut on corriger ce problème, as-tu une solution ?

Merci "

par spykrew07
(auteur de ce tuto - 25 septembre 2013)

" @Dimtoupouri Merci pour ton retour et content que ça t'es plu ! "

par Dimtoupouria voté :
(a acheté ce tuto - 25 septembre 2013)

" Parfait, même pour commencer...je n'y connaissais absolument rien avant, et je suis bien content des résultats que j'arrive à obtenir! Parfait!
(attention des fois ça va très vite et le retour en arrière n'est pas très précis sur le lecteur de l'ipad) "

par saeba87
(a acheté ce tuto - 23 août 2013)

" Bonjour,

Bon tuto mais j'ai en ce moment un petit problème , je pense que ça doit être une bête erreur mais je sais pas trop ou

le lien : http://image.noelshack.com/fichiers/2013/34/1377291954-mw.jpg

merci d'avance

"

par thoaupe
(a acheté ce tuto - 20 août 2013)

" pfff, ich bin trop bête :
le pb venait de mon url,
locallhost:8888 suffisait pour moi, et tout s'affiche parfaitement.
Bon... voyons voir ce pb de mail qui ne s'envoie po... "

par thoaupe
(a acheté ce tuto - 19 août 2013)

" Bonjour,

Je suis le tuto et j'apprends en m'amusant (tout en m'arrachant des touffes de cheveux), mais je rencontre le même problème que certain :

• yezza sur le hover du menu décalé vers le bas.
• cappu pour les h2 qui disparaisse après un survol.

c'est la même chose quand je fais un aperçu avec tes fichiers sources
Mais ce qui est encore plus étrange... c'est qu'avant que ça parte en sucette, les aperçus étaient parfaits... hmmm, oui, je me souviens, c'est à partir du moment ou j'ai commencé à tester le formulaire avec MAMP que le monstre s'est libéré de ses chaines.
D'ailleurs... tu vas rire... j'arrivais à l'afficher avec MAMP j'étais vachement fier de moi, tout était bien calé, bon il y avait encore cette histoire de mail que je n'arrivais pas à m'envoyer, mais je touchais presque au but.

Bref, c'est la deumair je vais rêver de code "

par renoasha voté :
(a acheté ce tuto - 03 juillet 2013)

" simple, clair, efficace. Tutoriel de grande qualité pour tous les niveaux. "

par baboundu81a voté :
(a acheté ce tuto - 25 juin 2013)

" Très sympa et très clair ! Il me tarde de passer à la suite... "

par Hogana voté :
(a acheté ce tuto - 10 juin 2013)

" Trés bon tuto avec un produit final incroyable,
Petit problème le formulaire de contact foire un peu ...une solution plus simple ? je souhaite rajouter pas mal de chose sur ce formulaire mais je n'arrive pas a le faire envoyer ..

"

par yezzaa voté :
(a acheté ce tuto - 31 mai 2013)

" Merci Adrien, je t'ai envoyé mes fichiers. Mais surtout n'y passe pas un temps fou, ce ne serait pas rentable :) , parole d'entrepreneuse !
"

par spykrew07
(auteur de ce tuto - 31 mai 2013)

" @yezza Envoi moi ton site complet sur contact [at] adriengazaix.fr je vais regarder ;) "

par yezzaa voté :
(a acheté ce tuto - 30 mai 2013)

" oui, je viens de refaire des tests, j'ai rechargé Chrome, j'ai repris les fichiers sources et les mien, mais j'ai toujours ce menu qui saute. après le scroll sur la rubrique appelée, il y a comme un petit rebond, et la bande "class active" passe sur la rubrique au dessus. Je ne comprends vraiment pas... Et il n'y a pas d'autres utilisateurs qui ont eu ce problème apparemment... je me sens seule :)
"

par spykrew07
(auteur de ce tuto - 30 mai 2013)

" @yezza Oui c'est vraiment bizarre car je fais le tuto sur Chrome justement. Tu as comparé avec les sources ? "

par yezzaa voté :
(a acheté ce tuto - 29 mai 2013)

" Toujours pour ce problème de scroll, je tiens à ajouter que cela ne se produit que sur Chrome, pas sur IE "

par yezzaa voté :
(a acheté ce tuto - 29 mai 2013)

" Génial et très didactique!!! Merci bcp. 1 pb persite avec tes sources et mes fichiers: ma bande de selection dans le menu saute sur la rubrique du dessus à la fin du scroll. J'ai pourtant revu ts mes padding et margins, une par une. Rien à faire... Une idée peut etre ? Bien cordialement. "

par spykrew07
(auteur de ce tuto - 22 mai 2013)

" @shyalin Alors c'est génial !! Bonne continuation :D "

par shyalina voté :
(a acheté ce tuto - 21 mai 2013)

" Bravo pour ce tuto spykrew07! , c'est très bien expliqué pour une débutante comme moi et ta voix est très agréable et posée, c'est rassurant quand on ne sais pas où on met les pieds ;-). Grâce à ce tuto je viens de réaliser mon premier site web en code! "

par jeff7sa voté :
(a acheté ce tuto - 13 mai 2013)

" 5/5.
mais le son gagnerait a etre de meilleure qualité. "

par paulleleua voté :
(a acheté ce tuto - 11 mai 2013)

" encore une fois trés clair,
très efficace, très bien ! "

par damienlvkaa voté :
(a acheté ce tuto - 06 mai 2013)

" Bonjour et merci pour ce tuto vraiment très bien réalisé. Le formateur vous accompagne pas à pas à construire un site one page très efficace.
PAr contre, j'ai remarqué que la réception d'email ne se fée pas à chaque fois ?! Quelqu'un aurait il rencontré le même problème que moi ?
Merci beaucoup. "

par spykrew07
(auteur de ce tuto - 24 avril 2013)

" @phil9173 Pourquoi veux tu qu'il disparaisse ? Le mail a été envoyé donc on affiche un message de succès. Sinon tu ne fait pas partir le formulaire et tu vide les champs quand tu envoi le mail si tu préfères. Merci du retour ;) "

par phil9173a voté :
(a acheté ce tuto - 23 avril 2013)

" Tres bien mais il manque la disparition du message bien envoyé "

par phil9173a voté :
(a acheté ce tuto - 19 avril 2013)

" Très bon tuto, j'adore le style.
J'attend un prochain tuto sur paypal que je pourais inclure. Merci d'avance. "

par spykrew07
(auteur de ce tuto - 12 avril 2013)

" @DimC Je suis content que tu es pu trouver ton erreur tout seul ;) Au plaisir de te revoir sur mes prochains tutos ! Bonne continuation ! "

par DimCa voté :
(a acheté ce tuto - 11 avril 2013)

" Bon j'ai finalement résolu mon souci.

En fait c'était à cause du noms de mes variables.
"form_nom", "form_prenom" etc...

Le underscore foutait le boxon. Sans doute à cause du "strip_tags" :)

Du coup j'ai mis des variables plus simples et bingo. "

par spykrew07
(auteur de ce tuto - 10 avril 2013)

" @DimC Oui j'ai bien reçu et j'ai jeté un oeil rapidement. Pour l'instant je n'ai pas trouvé d'erreurs... dès que j'ai un moment je regarderai encore. "

par DimCa voté :
(a acheté ce tuto - 10 avril 2013)

" Juste pour information, avez-vous bien reçu mon email ?

Cordialement "

par spykrew07
(auteur de ce tuto - 10 avril 2013)

" @Maxouel Ton site est bien sur un serveur local ? As-tu bien installé Easyphp ? "

par spykrew07
(auteur de ce tuto - 10 avril 2013)

" @Diamond Merci beaucoup pour ton retour très positif et à bientôt pour de nouveaux tutos ;) "

par Maxouela voté :
(a acheté ce tuto - 09 avril 2013)

" Merci pour ce tuto qui m'a permis pour la premiere fois de toucher a du code.
Bon j'ai un soucis avec le formulaire, je ne recois jamais les mails (oui j'ai mis mon adresse mail dans le index.php ^^).

De plus le paragraphe <?php?> je suis oblige de le mettre tout a la fin de index.php sinon le site se s'affiche plus dans mon navigateur et je n'ai que le code brut qui apparait.
Peut etre que ces problemes sont lies..
Merci pour votre aide.

Julien "

par DimCa voté :
(a acheté ce tuto - 09 avril 2013)

" J'ai tout envoyé sur votre email, merci d'avance pour l'aide :) "

par spykrew07
(auteur de ce tuto - 08 avril 2013)

" @DimC Envoi moi ton site dans un .zip ainsi que l'adresse du site en ligne sur OVH je vais jeter un coup d'oeil ;) "

par DimCa voté :
(a acheté ce tuto - 08 avril 2013)

" Bonjour et merci pour ce tuto fort agréable. J'ai quasiment fini mon portfolio One Page grâce à vous.

Néanmoins j'ai un problème actuellement. Je ne reçois pas les mails de mon formulaire de contact :/

Si je ne mets que le php, ça fonctionne. Mais dès que j'ajoute la partie ajax je ne reçois plus rien.

Pourtant j'ai tout comme vous excepté un champs "prénom" en plus.

Le loading et le message "bien transmis" fonctionnent très bien. Et j'ai mis une alerte pour voir ce qu'il y avait dans la variable "donnees", tout semble OK.

J'avoue ne pas comprendre où ça cloche.

(site hébergé sur ovh)

Merci pour votre aide

Dimitri "

par ataraxie111
(a acheté ce tuto - 31 mars 2013)

" Bonjour et merci pour ce très bon tutoriel. J'ai cependant une petite requête : Comment peut-on s'y prendre pour créer un effet de transition sur l'affichage/disparition (ou un déplacement) de la barre du menu sur lequel on clique ? J'ai essayé d'ajouter un paramètre de temps sur le addClass et le removeClass, mais ça ne fonctionne pas... De plus, lorsque l'on charge la dernière version de JS (la 1.9.1), le bouton Hide disparaît en fade dès lors que l'on charge la page.

Merci d'avance ! "

par spykrew07
(auteur de ce tuto - 29 mars 2013)

" @sampabs Je vais surement te décevoir mais je ne pense pas faire un tuto wordpress à partir de cette maquette désolé :/ Mais comme c'est un onepage il te suffit d'aller chercher le contenus de toutes tes pages et de les afficher les uns à la suite des autres. Bon courage à toi ;) "

par sampabs
(n'a pas acheté ce tuto - 29 mars 2013)

" Je n'ai pas acheté la vidéo. Ce qui pourrait me convaincre c'est que tu réalises un tuto pour le transformer en thème wordpress ^^
Merci "

par nanard2000a voté :
(a acheté ce tuto - 24 mars 2013)

" Salut, tout d'abord c'est un excellent tuto.
je ne suis pas dév mais je suis très satisfait de cette formation.

en revanche je n'arrive pas a obtenir le plug pagescroll, même après avoir entré mon mail ?

serait il possible que quelque me le fasse parvenir ?

à vous les tut's

nanard2000 "

par spykrew07
(auteur de ce tuto - 21 mars 2013)

" @dreamdesign Il ne faut pas chercher loin, Internet Explorer ne connait pas cette propriété css pour faire des textes en colonnes. Il faut trouver un subterfuge en jquery pour que ça marche. Tu as ceci par exemple : http://welcome.totheinter.net/columnizer-jquery-plugin/ Après je ne sais pas si ça vaut le coup que tu t’embêtes à trouver une solution pour ie car le texte apparaîtra comme un paragraphe normal donc c'est pas si terrible. Bon courage, bye ;) "

par dreamdesign
(a acheté ce tuto - 20 mars 2013)

" Salut, non je n'ai plus ce soucis semblerai que ce soucis vient de mon cache firefox encore, cela dit j'ai un petit soucis sous IE dans la section About us & News le texte ne se met pas en colonne ! je ne trouve pas le soucis

http://dreamdesignagency.comyr.com/client/Fleurdorient/web/

".col
{-webkit-column-count:3;
-webkit-column-gap:50px;
-webkit-column-rule:1px dotted #d60000;

-moz-column-count:3;
-moz-column-gap:50px;
-moz-column-rule:1px dotted #d60000;

-o-column-count:3;
-o-column-gap:50px;
-o-column-rule:1px dotted #d60000;

column-count:3;
column-gap:50px;}"

et j'ai aussi dit dans ma feuille index.php deprendre le google.js
" "

par spykrew07
(auteur de ce tuto - 19 mars 2013)

" @dreamdesign Je ne comprends pas trop ton problème. Normalement le code qui il y a en début de page entre les balises php ne devrait prendre aucune place visuellement. Et ça m'étonne qu'il y est le même problème sur mes fichiers sources. Tu as un exemple en ligne ? "

par dreamdesign
(a acheté ce tuto - 19 mars 2013)

" tout d'abord je tien a te remercier pour ce tutorial, cela ma permis de me remettre dans le bain après quelque année d'abandon je dirai :D
cela dit j'ai un petit soucis quand j'ai mis le codage tout au dessus de mon fichier index.php j'ai mon menu_active.png qui se décale vers le bas et donc n'est plus centrer comme au début ? j'ai vérifié le dossier source et c'est pareil!! auriez vous une petit solution ?
Merci encore pour cette formation

Bien à vous, "

par bluedevila voté :
(a acheté ce tuto - 04 mars 2013)

" Bonjour spykrew07,
J'ai repris ton code et j'ai toujours ce comportement étrange de bouton qui disparait vers le haut de la page. Je vais donc utiliser click plutôt que toggle. Mais, pourrais-tu, STP, m'expliquer comment utiliser Click pour faire réapparaître le bouton, une fois que je l'ai fait disparaître ?
La partie suivante fonctionne correctement :
$('#cacher').click(function() {

// Animation CSS de la sideBar via les boutons Afficher/Cacher
$('#sideBar').animate({left:'-230'});
$('#cacher').animate({right:'-70'});
$('#cacher').addClass('afficher');//permutation du bckg

$('.contenu').animate({'margin-left':'160'});

});
J'ai voulu créer une deuxième fonction pour l'affichage en remplaçant #cacher par #afficher mais cela ne fonctionne pas !
Encore merci pour ton aide.
Bluedevil "

par spykrew07
(auteur de ce tuto - 01 mars 2013)

" @bluedevil J'utilise Toggle au lieu de Click car ça gère le 2ème click qui permet de faire l'action inverse. Si tu veux utiliser Click il faut cacher ton bouton et en faire réapparaître un nouveau avec une nouvelle action qui permet de faire le remontrer. Et pour el fait qu'il remonte vers le haut je ne pense pas que ce soit le comportement normal ... tu as regardé les fichiers sources pour voir si tu avais fais une petite erreur quelque part ? "

par bluedevila voté :
(a acheté ce tuto - 28 février 2013)

" Excellent travail. J'ai juste une question concernant le bouton show/hide car sur mon site celui-ci disparait vers le haut de la page. Pour cacher le menu, cela fonctionne avec click pas avec toggle. Y a-t-il une astuce ?
Merci de ton aide "

par spykrew07
(auteur de ce tuto - 22 février 2013)

" @vincentguinand Répondu par email ;) "

par vincentguinand
(a acheté ce tuto - 21 février 2013)

" Hello,
Merci pour ce tuto ! Parfait !
J'ai ajouté des rubriques, tout fonctionne mais en ce qui concerne la rubrique PHOTOS, je coince... En effet, j'ai ajouté Fancybox, mes images apparaissent et l'animation fonctionne correctement mis à par que lorsque l'image s'agrandit, je reviens automatiquement à la rubrique Home (la première alors que la rubrique PHOTOS et la septième rubrique.) Evidemment, lorsque je clique sur une image je veux rester dans la rubrique PHOTOS.

Que dois-je faire ?

Merci d'avance "

par spykrew07
(auteur de ce tuto - 13 février 2013)

" @Capu Envoi moi ton site complet par email, je jetterai un oeil la-dessus parce que sans voir les fichiers c'est difficile de t'aider : contact[a]adriengazaix.fr "

par Capua voté :
(a acheté ce tuto - 13 février 2013)

" @spykrew Le site que je fais en suivant ta vidéo mais en partant de tes fichiers sources pour gagner du temps en évitant de les télécharger... Ça vient de là?
et maintenant mon background ne s'affiche plus quand j'ai commencé la partie pageslide (avec ton fichier source) je réussi toujours à trouver d'où vient l'erreur rapidement mais la je suis perdue depuis 4h je n'arrive pas à voir ou est le problème pour ça non plus!
pardon de t’embêter..
Merci beaucoup pour ta réactivité en tout cas, c'est top. super tuto.


"

par spykrew07
(auteur de ce tuto - 13 février 2013)

" @Capu Le bug tu l'as sur le site que tu as fait toi en suivant la vidéo ? ou bien sur le site que je fourni dans les sources du tuto ? "

par Capua voté :
(a acheté ce tuto - 13 février 2013)

" @Spykrew, je suis désolé qu'entends-tu par tester les fichiers sources? "

par spykrew07
(auteur de ce tuto - 13 février 2013)

" @Capu Quand tu testes les fichiers sources tu as le même problème ? "

par Capua voté :
(a acheté ce tuto - 13 février 2013)

" Merci beaucoup pour ce tuto!
Petite question: j'ai un bug sur mes news, quand ma souris sors de la news, le H2 disparait et revient quand la souris passe sur une autre news..
Un problème de cufon refresh sans doute mais je n'ai pas trouvé la solution !
Quelqu'un a une idée?
Merci beaucoup en tout cas, premier tuto et hâte de découvrir tous tes autres! "

par chichou007a voté :
(a acheté ce tuto - 12 février 2013)

" Tuto très clair et très bien fait! Le formateur s'exprime de façon claire et fluide. Merci! "

par spykrew07
(auteur de ce tuto - 02 février 2013)

" @biibz Content que ça t'es plu ;) "

par biibza voté :
(a acheté ce tuto - 31 janvier 2013)

" Bon, ca fait plaisir de voir des tuto pas pour les débutants débutants... "

par nanard2000a voté :
(a acheté ce tuto - 20 janvier 2013)

" premiere prog pour moi (enfin prog..........) ca marche nickel "

par fjsinfoa voté :
(a acheté ce tuto - 10 janvier 2013)

" Très bien mais un peu rapide. Merci pour le travail fourni. "

par elmstreet
(n'a pas acheté ce tuto - 09 janvier 2013)

" J'avais exactement la même question quant à la compatibilité avec les iPad.
Y a t-il un endroit où on peut voir ton site de démo en ligne pour pouvoir le tester sur tablettes ?

Merci d'avance,
Gildas. "

par perspectifa voté :
(a acheté ce tuto - 05 janvier 2013)

" Bonjour,

Félicitations pour ce tuto, il est extra. A partir du tuto, j'ai réalisé un site qui n'utilise pas un slider fullscreen, mais une image fixe par section. Ces images sont étirées en fullscreen grâce à la propriété css background-size:cover. Le site est bien affiché sur tous les systèmes que j'ai pu utiliser (tant les pc que les tablettes)...sauf sur ipad. Ma question s'éloigne un peu du tuto, mais tu sembles maîtriser le sujet...sais-tu comment je peux rendre mon site compatible ipad? Aurais-tu (par hasard) rédiger un tuto à ce sujet?

Voici le site dont je parle: http://www.perspectif.be

Merci d'avance et encore bravo! "

par perspectifa voté :
(a acheté ce tuto - 05 janvier 2013)

" excellent tuto...clair, complet, très bien expliqué! Bravo "

par spykrew07
(auteur de ce tuto - 27 décembre 2012)

" @GeekDesigner Content que ça t'es plu ;) Bonne continuation !! "

par GeekDesignera voté :
(a acheté ce tuto - 26 décembre 2012)

" De la bombe! :) J'ai rencontré des difficultlés, étant donné que c'est la toute première fois que je touche au code, mais je suis arrivé à toutes les résoudre, super formateur! "

par Aeden1202a voté :
(a acheté ce tuto - 20 décembre 2012)

" J'ai réglé mon soucis, désolé du dérangement :) "

par Aeden1202a voté :
(a acheté ce tuto - 20 décembre 2012)

" Super tuto, il m'a fait apprendre pleins de choses. Merci à toi et continue :) "

par Aeden1202a voté :
(a acheté ce tuto - 20 décembre 2012)

" Bonjour et un grand merci pour ce tuto qui me fait apprendre pas mal même beaucoup de chose :)
Cependant j'ai un soucis avec le pluggin pageScroller.

quand je clique sur mes liens dans la barre de nav, le sroll descent bien et mon focus reste bien sur mes liens, par contre si je manipule le scroll moi même que je le fasse monté ou descendre, arrivé a ma section le focus dans ma barre de navigation ne prend pas.

auriez vous une idée pour me sortir de la?

Merci d'avance :) "

par valkospyke
(a acheté ce tuto - 19 décembre 2012)

" bonjour, j'ai un petit problem quand je cliques sur une news j'ai bien la news change de couleur et la page a droite qui bascule. mais quand je ferme la barre a droite, la news reste de couleur et mon caroufre de mes autre page ne fonctionne plus, sauf si j ouvre une news dans le menu different. pouvez vous m'aider? "

par vd2012
(a acheté ce tuto - 13 décembre 2012)

" Bonjour,
Oui, vraiment super ce tuto, c'est déjà du lourd et je vois tout le chemin qu'il me reste à faire !...
Merci pour tes excellents tutos !
Une question : lorsque je suis sur la section about ou contact et que je refresh la page, le "menu active" remonte bien sur home, par contre, le contenu de ma page reste sur la rubrique (par exemple contact). Je me casse la tête sur la question depuis 1 jour !
Quelqu'un à une idée géniale pour résoudre la question ?
Merciiiiii "

par spykrew07
(auteur de ce tuto - 12 décembre 2012)

" @meletwil Génial alors !! Merci à toi pour tous ces compliments ;) "

par meletwila voté :
(a acheté ce tuto - 11 décembre 2012)

" je ne m'en lasse pas, un vrai régal, la progrssion du tuto est très bien faite, les explications sont claires encore merci ..... ;) "

par spykrew07
(auteur de ce tuto - 20 novembre 2012)

" @benji9 Très content que ça t'es plu !! Merci pour ce super compliment ;) "

par benji9a voté :
(a acheté ce tuto - 20 novembre 2012)

" Excellentissime tuto, clair et très bien fait.
Bravo! "

par dianeCaroff
(a acheté ce tuto - 19 novembre 2012)

" @spykrew07 : C'est bon tu avais raison c'était juste que cela ne fonctionnait pas en local.
je l'ai mis sur le serveur et tout fonctionne !

Merci beaucoup pour ton aide!
"

par spykrew07
(auteur de ce tuto - 16 novembre 2012)

" @dianeCaroff Vous avez bien mis votre email dans le fichier PHP ? Si oui et si ça ne marche toujours pas c'est que dans Apache (php.ini) il faut entrer le SMTP de ton fournisseur d'accès (ex : smtp.free.fr) J'espère que tu trouveras une réponse à ton problème sinon normalement si tu envoi ton site sur un vrai serveur tout devrait fonctionner comme sur des roulettes ! Merci pour ton retour ;) "

par dianeCaroff
(a acheté ce tuto - 16 novembre 2012)

" Merci pour ce tuto ! excellent travail !
J'ai juste un petit problème... je ne reçois pas les demandes de contact via le formulaire sur ma boite mail.

J'ai bien regardé les sources et je ne vois pas ce qui pose problème.

Une idée ? :)

Merci d'avance pour ta réponse. "

par spykrew07
(auteur de ce tuto - 13 novembre 2012)

" @calysse Essayes de mettre un !important à côté de ta règle CSS comme ça par exemple :

#bg { background:#000!important; }

Bon courage et merci de ton retour ;) "

par calyssea voté :
(a acheté ce tuto - 13 novembre 2012)

" Super tuto très bien expliqué; Merci:!!!
J'ai pratiquement fini mon site, seul pb; je n'arrive pas à modifier la couleur du fond des News à droite. Je suis allée dans pageslide.css, et tentée de remplacer un background, mais sans succès...
Une solution?
"

par tiwilla voté :
(a acheté ce tuto - 12 novembre 2012)

" Merci c'est très bien pour la methode de decoupe de design. "

par spykrew07
(auteur de ce tuto - 11 novembre 2012)

" @Greg1 Regardes bien les sources du tuto tu as du faire une petite erreur, un point virgule oublié... souvent ce n'est pas grand chose. "

par Greg1
(a acheté ce tuto - 10 novembre 2012)

" " Bonjour , en fait mes images n apparaissent pas ,l ecran reste noir ,j ai un soucis au niveau de la programmation aux back ground full page, a 9 min 46 ,j ai fait tout a lettre ,sur firebug j ai cela :

(function(a){a(document).ready(function(){a("body").append('<div id="supersized-loader"></div><ul id="supersized"></ul>')});a.supersized=function(b){var c="#supersized",d=t......

a ma droite sur firebug cela:

toString
function()

Closure Scope
Closure Scope { arguments=[1], b={...}, c=

"#supersized"

}

Closure Scope
Closure Scope { toString=function()}

Fenêtre
Window index.php

,je pensais que c etait le chemin de mes images ,quand je les mets dans l index.php ,ca fonctionne!! donc mon chemin est bon
le favicon fonctionne aussi

pourrais tu m aider

merci "

par Orosis
(a acheté ce tuto - 09 novembre 2012)

" sepohk il suffit de modifier un peu la partie "news" pour avoir ce que tu recherches.
J'ai moi utilisé le d=code pour la partie galerie. J'ai toutefois un bug, en dehors d'une redimension manuelle de la page (cliqué déplacé) les images sont coupées sur la hauteur comme si le navigateur n'actualisait pas.

Merci spykrew07 pour ce tuto ;) "

par sepohk
(a acheté ce tuto - 04 novembre 2012)

" " Bonjour spykrew07 et Merci pour ce tutorial.
J'aurais une question, je voudrais intégrer a ce site une galerie, j'ai crée un nouvelle onglet dans le menu, "galerie" et j'aimerais a présent y intégrer une galerie avec la possibilité d'afficher 5, 10 lignes de commentaire quand on clique sur l'image et que celle-ci apparaît en plus grand.
Je voudrais avoir ton avis sur la réalisation d'une galerie et si tu connaissais un plugin jQuery qui pourrait s'intégrer au site ?
contact_a_adriengazaix.fr avec le @ à la place de _a_ pour te contacter ? " "

par spykrew07
(auteur de ce tuto - 31 octobre 2012)

" @Greg1 J'ai pas compris ta question désolé. Tu l'enregistres en quel format ? Si tu veux de la transparence il faut choisir PNG, sinon du JPG. Bon courage ;) "

par Greg1
(a acheté ce tuto - 31 octobre 2012)

" Bonjour, quand je selectionne avec alt et le logo,juste avant le rognage, il me le sauve en noir ,je ne vois quasi rien ,comment puis je le mettre sur fond blanc ou en blanc. "

merci "

par spykrew07
(auteur de ce tuto - 25 octobre 2012)

" @steph15 Si ça va trop vite je te suggère de repasser sur la formation html en 2 parties et de poursuivre avec celle sur le css. Après normalement tu pourra revenir sur celle-ci plus facilement ;) Bonne continuation ! "

par steph15a voté :
(a acheté ce tuto - 24 octobre 2012)

" dur à suivre pour un presque novice mais on progresse. "

par spykrew07
(auteur de ce tuto - 16 octobre 2012)

" @cid5420 C'est le UTF-8 (sans BOM) qu'il faut choisir si tu ne veux pas avoir de problème par la suite. "

par cid5420a voté :
(a acheté ce tuto - 16 octobre 2012)

" lorsque j'encode en utf8, toujours le même problème, en revenche en utf8 (sans DOM) je n'ai pas de problème, pourquoi? "

par spykrew07
(auteur de ce tuto - 12 octobre 2012)

" @cid5420 Tes fichiers ne sont tout simplement pas encodés en UTF-8 ;) "

par cid5420a voté :
(a acheté ce tuto - 11 octobre 2012)

" bon encore pas mal de problème du côté des caractère spéciaux.
J'aimerais un peu d'aide.
De plus j'ai adapté le tuto infobox sur ce site, je dois dire que c'est excellent !
Mais je rencontre un prolème de redirection ! :(
Bon bah je regarderais demain. Je suis mort lol ! "

par cid5420a voté :
(a acheté ce tuto - 11 octobre 2012)

" ok merci de cette réponse très rapide !
bon au niveau fluidité ça va, j'ai gagné en rapidité en farfouillant a droite et a gauche.
Cependant, pour finalisé mon site, il me reste un petit problème, lors de l'envoi du message, mon message d'envoi est bien présent, mais les "é" sont sous forme "?"
Pour mon index.php, j'avais le même problème pour la pageslide mais résolut grâce à un encodage différent. donc le site.js doit t-il être encodé?
et mon loading ne fonctionne pas "

par spykrew07
(auteur de ce tuto - 11 octobre 2012)

" @cid5420 Certains navigateurs ont besoin de + de ressources et sont beaucoup plus lourd à exécuter. Moi j'utilise Chrome parce qu’il est très léger et que tout s'excute assez rapidement. Il n'y a pas beaucoup de solutions pour améliorer la fluidité hormis de minifier tous les fichiers .js dans un seul et de créer un fichier le plus petit possible. Désolé de ne pas plus pouvoir t'aider sur ce point la. Bonne continuation. "

par spykrew07
(auteur de ce tuto - 11 octobre 2012)

" @aiborion Jolie trouvaille pour ceux qui cherchaient à faire fonctionner le lecteur sous Firefox. Je pensais que c'était du au format .mp3 non pris en charge. Merci à toi ;) "

par aiborion
(a acheté ce tuto - 11 octobre 2012)

" Pour faire fonctionner le lecteur audio sous Firefox, allez savoir pourquoi, mais tout fonctionne bien si vous supprimez cette ligne: swfPath: "/js" "

par cid5420a voté :
(a acheté ce tuto - 11 octobre 2012)

" encore une foi bon tuto mais j'ai des problème de fluidité et rapidité. Comment corriger le problème?
J'ai mis les script js entre head hormis le pageslide sinon ça ne marche pas! j'ai gagné une nette amélioration sur chrome mais mozilla et IE sont très lent "

par cid5420a voté :
(a acheté ce tuto - 10 octobre 2012)

" Très beau tuto !
Je réalise mon site sur cette base qui est très sympa.
Cependant, je rencontre un gros problème, mon paragraphe dans la pageslide ne prend pas en charge les caractères spéciaux. De plus, si je lui applique la police cufon, le texte est invisible dans la pageslide.
Une dernière question, lorsque l'on a un texte très long, comment peut-on faire? j'ai pensé a une scroll bar mais celle-ci va t-elle pas entrer en conflit avec celle window?
je sais pas si je suis clair mais si vous pouvez m'aider.
Merci "

par aiborion
(a acheté ce tuto - 09 octobre 2012)

" Comme Grassel j'ai également un problème sur Firefox avec les cufon.refresh sur les single _news lorsque ma souris sort d'une news, le titre ne se remet pas en noir "

par LITAEAUa voté :
(a acheté ce tuto - 09 octobre 2012)

" Petite question cher spykrew07 : n'est il pas plus judicieux de placer les scripts Jquery dans le header afin de gagner en temps de chargement et pour ne pas attendre le téléchargement de tout l'index pour lancer la machine? Merci pour ta réponse ! A bientot "

par LITAEAUa voté :
(a acheté ce tuto - 09 octobre 2012)

" Tout simplement parfait !!! Excellente formation avec un formateur très technique !!! Impeccable. "

par spykrew07
(auteur de ce tuto - 05 octobre 2012)

" @Dario67 Tout est possible. Mais je ne pense faire un tuto la dessus par contre. Je te renvoi donc vers le site officiel du plugin pour créer ton système. Bonne continuation. "

par Dario67a voté :
(a acheté ce tuto - 04 octobre 2012)

" Et moi pas de réponse? Est-ce possible ou non? créer plusieurs gallérie. "

par spykrew07
(auteur de ce tuto - 03 octobre 2012)

" @khyriana J'ai répondu par email ;) "

par khyriana
(a acheté ce tuto - 03 octobre 2012)

" Je comprends que l'on soit tous rush, mais j'aimerai savoir si je peux espérer une réponse suite à l'envoi de mes fichiers il y a une semaine…
Merci de votre compréhension
"

par Dario67a voté :
(a acheté ce tuto - 30 septembre 2012)

" Très bon tuto j'ai même commencer à créer mon site web sur cette base. Par contre Spykrew07 si tu pouvais aller plus loin dans la gestion du plug in supersized ce serait génial. Comment créer une gallérie avec différent thème comme gallérie portrait, paysage etc. Mon projet et de créer un système de commande de mes photos ou un thumbs avec un bouton sur la droite qui permette de choisir chaque thème et qu'en fonction des thème les photos qui défilent en background soit différentes. "

par Greg1
(a acheté ce tuto - 28 septembre 2012)

" super reactivité ,ca s appelle du professionalisme ! merci pour l info et je la prend de suite ;)
"

par maximilan
(a acheté ce tuto - 28 septembre 2012)

" Merci spykrew07 pour cette formation, très claire et très instructive!

Juste une petite question : Pourrais-tu donner les dimensions que tu utilises pour ta maquette sous Photoshop pour ceux qui n'ont pas suivi la précédente formation?

Je connais très bien le logiciel par contre je suis un peu moins à jour au niveau des formats.. Vu que tu parles d'images Full HD pour le Bg je me suis dit que c'était du 1920px*1080px en 72dpi mais je n'en suis vraiment pas sûr.. "

par spykrew07
(auteur de ce tuto - 28 septembre 2012)

" @Greg1 Tu n'as besoin de rien de payant ;) Notepad++ te suffit pour coder, et les plugins jQuery que l'on utilise dans le tuto sont gratuits aussi. Bonne formation à toi !! "

par Greg1
(a acheté ce tuto - 28 septembre 2012)

" bonjour, quelles sont les logiciels dont j ai besoin pour la formation ?et combien coutent ils? et ou puis je les acheter?

merci "

par spykrew07
(auteur de ce tuto - 28 septembre 2012)

" @grassel Pour le cufon.refresh sur les news je n'ai pas de problème de mon côté.
Pour le jPlayer sur firefox quelqu'un m'a aussi posé la question et je pense que firefox ne prend pas en compte le format mp3 donc il faut aller voir sur le site officiel du plugin pour ajouter une extension comme .ogg, .wma ... et convertir la musique en plusieurs formats pour que ça passe partout. Bonne continuation. "

par grassela voté :
(a acheté ce tuto - 28 septembre 2012)

" Toujours hyper performant ! bravo !
Sous Firefox, pas moyen de faire démarrer le jplayer...
PB avec cufon.refresh sur les single _news comme je te le disais en mail..
As-tu une idée pour résoudre le soucis ? "

par spykrew07
(auteur de ce tuto - 26 septembre 2012)

" @M@nu Le site est utilisable partout même sur internet explorer à condition de mettre le script html5.js dans le head, ainsi qu'un display:block sur les balises html5 : article, section ... "

par M@nu
(a acheté ce tuto - 26 septembre 2012)

" Le fait que tu utilises pas mal de balises HTML5 a t'il une influence importante sur les browsers compatibles? Si oui, à partir de quels versions le site fonctionne t'il et passe t'il en version "dégradée mais utilisable" sur les autres?
Merci pour ta réponse "

par dadouxa voté :
(a acheté ce tuto - 26 septembre 2012)

" mon tuto bonnes explications que dire d'autre perfect ! "

par dahisa voté :
(a acheté ce tuto - 22 septembre 2012)

" Excellent chapitre, bien expliqué, avec calme et précision... Je n'y connais presque rien en Jquery et javascript et pourtant, j'ai réussi très simplement à mettre en place et adapter le slide en fullsize. Super ! "

par spykrew07
(auteur de ce tuto - 21 septembre 2012)

" @samellite Je viens de vérifier et si on le fait. Regardes bien les sources du tuto... "

par MJVH
(a acheté ce tuto - 20 septembre 2012)

" C'est bon Adrien, juste une petite erreur de ma part :
en fait, je fermais la section "single news" avant la div modal au lieu d'après, ce qui me provoquait ce bug...

Merci encore "

par spykrew07
(auteur de ce tuto - 20 septembre 2012)

" @samellite C'est ce qu'on fait dans le tuto avec le background noir. Tu rajoutes un border dans le css sur la news qui la classe .news_active. "

par samellite
(a acheté ce tuto - 20 septembre 2012)

" Comment faire en sorte de spécifier la "News sélectionnée", par un effet, par exemple avec un encadré d'une autre couleur qui ne disparait que quand on passe à une autre news, qui sera sélectionnée et encadrée à son tour. J'ai beau cherché, je ne trouve pas.
merci "

par spykrew07
(auteur de ce tuto - 20 septembre 2012)

" @MJVH Essayes de regarder sur le site officiel du plugin si tu trouves la réponses à ta question. Normalement avec le code qu'il y a dans les sources il ne devrait pas y avoir de problème. Si tu ne trouves vraiment pas, je peux jeter un oeil à tes fichiers quand j'aurai un petit moment. Merci de ton achat ;) "

par MJVH
(a acheté ce tuto - 20 septembre 2012)

" Salut à toi Spykrew07

Très bon tuto, bien expliqué... mais j'ai un problème avec le carrousel de news
Le carroussel se déplace de 2 news (belle animation) puis recule de 1 (pas d'animation). Comme je trouvais pas, j'ai recopié ton code et ça fait pareil...

vois tu d'où ça peut provenir ??

Merci "

par spykrew07
(auteur de ce tuto - 19 septembre 2012)

" @marinellamartin Merci du compliment ça fait plaisir ;) "

par marinellamartina voté :
(a acheté ce tuto - 18 septembre 2012)

" Tuto très bien expliqué dans les moindres détails. En suivant le tuto on sait ce qu'on fait et pourquoi on le fait! Un grand merci. "

par petitemarizettea voté :
(a acheté ce tuto - 18 septembre 2012)

" Très ardu pour la novice que je suis, mais vachement bien enseigné. Je m'accroche pour la suite ! "

par Rocca0909a voté :
(a acheté ce tuto - 17 septembre 2012)

" OK merci. En attendant avec impatience un bon gros tuto PHP !!! "

par spykrew07
(auteur de ce tuto - 17 septembre 2012)

" @Rocca0909 J'ai fait une formation complète pour créer son site avec WordPress donc tu peux avoir un site dynamique avec un back office déja créé et adaptable à tout type de projet.

Sinon je n'ai pas encore fait de tuto sur comment créer un site dynamique avec php/mysql mais c'est envisageable ;) Peut-être que je ferai une formation pour acquérir les bases du PHP d'abord.

Bonne continuation ! "

par Rocca0909a voté :
(a acheté ce tuto - 17 septembre 2012)

" as tu déjà fait un tuto sur la conception d'un site dynamique ? "

par spykrew07
(auteur de ce tuto - 17 septembre 2012)

" @Rocca0909 Non ce site n'est pas dynamique, il faut connaître les bases du html pour modifier le contenu. Je n'ai pas prévu de suite pour le moment. "

par Rocca0909a voté :
(a acheté ce tuto - 17 septembre 2012)

" Je n'ai pas encore fini le tuto mais déjà bravo ! grand merci a toi !

J'ai une question cependant : ce site est il dynamique ?

une personne extérieure pourra t elle le modifier sans toucher au code ?

Si non, as tu un tuto qui expliquerai cette partie ?

Merci d'avance "

par spykrew07
(auteur de ce tuto - 17 septembre 2012)

" @khyriana Si tu as un soucis, envoi moi tes fichiers par email je regarderai ça dès que j'ai un moment ;) "

par spykrew07
(auteur de ce tuto - 12 septembre 2012)

" @samellite Mets ton site en ligne quelque part ou envoi moi tes fichiers par email, j'y jetterai un oeil dans la journée ;) "

par samellite
(a acheté ce tuto - 12 septembre 2012)

" Je n'arrive toujours pas à régler le problème du padding - top, j'ai bien rajouté la class.content pour chaque rubrique que j'ai rajoutée, mais pour chaque rubrique tout se colle en haut de page, comme si le padding est = o
Une idée ?

Merci encore ! "

par Driamar
(a acheté ce tuto - 11 septembre 2012)

" @spykrew07 : Merci beaucoup ! Je viens de te faire parvenir le mail justement ... Merci encore ! "

par spykrew07
(auteur de ce tuto - 11 septembre 2012)

" @Driamar Mon email c'est : contact_a_adriengazaix.fr Remplace le _a_ par le @ ;) "

par Driamar
(a acheté ce tuto - 11 septembre 2012)

" @spykrew je vais avoir besoin de tes lumières je pense ... Impossible, même en mettant la même chose que toi que dans les sources, d'avoir l'effet scroller ... je me prends la tête depuis ce matin pour essayer de trouver mon erreur mais impossible :/ Peux-tu me donner ton mail ? si c'est possible bien sur ... "

par JanoTutoa voté :
(a acheté ce tuto - 11 septembre 2012)

" Bonjour, vu mon age j'ai souvent un train de retard mais grace à des tutos tels que les votres j'arrive à voir les lumières du wagon de queue ...
Merci "

par spykrew07
(auteur de ce tuto - 11 septembre 2012)

" @Boak Merci à toi, et je suis très content qu'elle t'es plu ;) "

par Boakia voté :
(a acheté ce tuto - 11 septembre 2012)

" merci pour cette demonstration elle est bien, et tres comprehensible "

par spykrew07
(auteur de ce tuto - 11 septembre 2012)

" @Driamar Essayes de comparer avec les sources fournies avec le tuto et si vraiment tu trouves pas d'ou vient le problème, envoi moi un email avec tes fichiers zippé ;) "

par Driamar
(a acheté ce tuto - 10 septembre 2012)

" Désoler de t’embêter encore une fois, mais mon effet scroll lorsque je clique sur le menu ne fonctionne pas et il me dérègle mon menu sur les deux derniers choix :/ "

par Driamar
(a acheté ce tuto - 10 septembre 2012)

" Cela faisait 10 minutes que j'étais dessus, mais je ne trouvais pas l'erreur ... Et puis finalement si ! j'avais mis des " " au lieu des parenthèses :/ donc maintenant tout fonctionne !! Merci encore en tout cas ! "

par spykrew07
(auteur de ce tuto - 10 septembre 2012)

" @Driamar Tu as mis height:100% sur ton html, body dans le css ? Ton div .points il est bien en position:fixed ? "

par spykrew07
(auteur de ce tuto - 10 septembre 2012)

" @soso-rug Je n'y est pas pensé, mais si plusieurs personnes me le demande je peux envisager faire un tuto pour créer un thème WordPress à partir de cette intégration. "

par Driamar
(a acheté ce tuto - 10 septembre 2012)

" j'ai enfin attaquer l'intégration ! Juste un petit souci ... Je n'arrive pas à faire apparaitre les points sur l bg ... J'ai beau faire tout ce que tu dis, il ne se passe rien :/ "

par soso-rug
(a acheté ce tuto - 10 septembre 2012)

" Bonjour, allez vous faire un tuto sur l'intégration de ce site onepage dans wordpress ? "

par alamedagraphika voté :
(a acheté ce tuto - 10 septembre 2012)

" une bonne technique pour rogner les images d'un layout. merci "

par spykrew07
(auteur de ce tuto - 09 septembre 2012)

" @samellite t'as du oublier de rajouter la class .content sur ta nouvelle rubrique qui lui donnera une height de 100% et un padding-top ;) "

par samellite
(a acheté ce tuto - 09 septembre 2012)

" Petit souci !
Quand je rajoute d'autres sections, je n'ai plus la marge sup, les titres se collent en haut de page.
Quelle solution ?
Merci ! "

par tailivana voté :
(a acheté ce tuto - 08 septembre 2012)

" Ai eu pbm de telechargement egalement, ai donc visionné en ligne et tjs aussi satisfait des tutos de Spykrew....
Attends le suivant avec impatience....
Bonne continuation
José "

par agrafa voté :
(a acheté ce tuto - 08 septembre 2012)

" super tuto, complet et accessible pour beaucoup.
En plus ce tuto offre deaucoup de possibilités de dévellopement (design et codes).

Merci et BravO "

par spykrew07
(auteur de ce tuto - 08 septembre 2012)

" @Driamar Oui on peut rajouter facilement d'autres rubriques, tu verras j'en parle à un moment dans la formation. Merci de ton retour ;) "

par Driamar
(a acheté ce tuto - 08 septembre 2012)

" Merci beaucoup ! Je viens juste de finir avec celle concernant le design :D j'ai hâte de commencer !

Petite question : en plus de "Home, About Us et Contact" peut-on rajouter facilement d'autres choix ?

Merci encore !!!!! "

par Jean LouisCouvelarda voté :
(a acheté ce tuto - 07 septembre 2012)

" De retour pour cette rentrée pour continuer a suivre de prés les formations de Spykrew.
Juste un survol de la formation très complète avant de m'attaquer de façon plus concrète. "

par loloden
(a acheté ce tuto - 06 septembre 2012)

" Ah je l'attendais avec impatience !!! J'ai hâte d'attaquer la partie intégration, pour avoir suivi pas mal de tes tuto, je sens que je vais prendre un abonnement également ^_^
D'ailleurs, j'an ai repéré plusieurs qui vont bientôt faire partie de mon panier (façon de parler ;) ). "

par lottaviani
(a acheté ce tuto - 06 septembre 2012)

" Tout est ok aussi par chez moi!! Merci pour la réactivité les gars et maintenant au travail!!... "

par spykrew07
(auteur de ce tuto - 06 septembre 2012)

" @samellite @bass33 Merci du retour et bonne formation !!

@Pumbostar Le staff de tuto.com a réglé le soucis, régales toi bien ;) "

par bass33
(a acheté ce tuto - 06 septembre 2012)

" Un petit retour téléchargement : C'est ok pour moi, merci pour votre réactivité ;) "

par bass33
(a acheté ce tuto - 06 septembre 2012)

" No stress ;)

J'en suis au design pour l'instant, j'adapte mon design. Par exemple, a la place des news j'aurais des catégories services, à propos, contact ce qui me fera un menu des plus simple avec un Home et un portfolio, je rajouterais certainement au menu les icônes réseaux, mentions légales et plan du site.

Par contre, je me demande si je peux dans le portfolio intégré ton tuto Portfolio filtrable ?

Sinon merci pour ton partage de connaissance, si je me débrouille en graphisme ce n'ai pas vraiment le cas en intégration, mais à force de suivre tes tuto je vais bien finir par m'en sortir ^^ "

par spykrew07
(auteur de ce tuto - 06 septembre 2012)

" @bass33 @lottaviani J'ai fait la demande au support, je suis désolé pour ce petit problème. "

par Pumbostar
(a acheté ce tuto - 06 septembre 2012)

" Salut Spykrew. Même galère chez moi, la dernière et la première impossible à télécharger depuis le player. "

par bass33
(a acheté ce tuto - 06 septembre 2012)

" Le problème persiste chez moi ;) "

par lottaviani
(a acheté ce tuto - 06 septembre 2012)

" Idem avec la dernière vidéo... "

par lottaviani
(a acheté ce tuto - 06 septembre 2012)

" Même problème de téléchargement mais sur 4ème vidéo cette fois ci! "

par spykrew07
(auteur de ce tuto - 06 septembre 2012)

" @LoFics @neelo @samellite Je demande tout de suite d'ou peut venir le problème pour que ce soit réglé très rapidement ;) Merci de votre achat en tout cas, ça me fait plaisir d'avoir un fan club aussi passionné :D "

par samellite
(a acheté ce tuto - 06 septembre 2012)

" Idem même problème, impossible de télécharger le premier et dernier fichier, plusieurs essais et toujours rien.
"

par LoFicsa voté :
(a acheté ce tuto - 06 septembre 2012)

" De même, toujours ce problème de telechargements! "

par neelo
(a acheté ce tuto - 06 septembre 2012)

" Je confirme qu'il y a un problème de téléchargement avec le player. "

par spykrew07
(auteur de ce tuto - 06 septembre 2012)

" @bass33 Tu as réussi à télécharger toutes les parties du tuto finalement ? Ou dois-je contacter le support pour que le problème soit réglé ? "

par bass33
(a acheté ce tuto - 06 septembre 2012)

" Merci également, juste un souci de téléchargement du 1er et dernier fichier via le tutoplayer ;) "

par LoFicsa voté :
(a acheté ce tuto - 05 septembre 2012)

" Merci pour ce tutorial! Très attendu pour beaucoup de membre de tuto.com! Mais en tout cas génial. Merci a toi "

 

Donnez votre avis ou posez une question au formateur.

Vous souhaitez commenter ce tuto vidéo ? Créez un compte gratuit. Déjà membre ? Identifiez-vous

Ce tuto en résumé ...

Ce tuto HTML 5, CSS 3, jQuery 1.8 d’une durée de 4 heures 36 minutes a été acheté 780 fois et a reçu une note moyenne de 5/5.

Ce tuto a été publié le 5 septembre 2012 par spykrew07, formateur certifié par Tuto.com, ayant reçu une note moyenne de 4,8/5 pour l’ensemble de ses vidéos, dans la catégorie Tuto HTML Formation.

Tous les fichiers sources sont fournis avec cette formation. Ces derniers vous permettront de reproduire les manipulations expliquées dans cette formation.

Cette formation qui se présente sous la forme de plusieurs vidéos, vous expliquera étape par étape, toutes les manipulations présentées par le formateur.

Toutes nos vidéos sont visionnées par notre équipe, avant d’être mises en ligne, garantissant ainsi la qualité des produits téléchargés.

N'hésitez pas à nous contacter si vous avez la moindre question !