Maîtriser les animations au SCROLL avec SCROLLTRIGGER de GSAP

แชร์
ฝัง
  • เผยแพร่เมื่อ 18 ก.ย. 2024
  • Maîtriser les animations au SCROLL avec ce tutoriel sur SCROLLTRIGGER de GSAP. Ce tuto scrolltrigger est là pour vous donner les bases avec ce plugin en vue d'autres vidéos plus complexe ;-)
    Je vous ai mi le code sur CodePen si vous voulez :
    codepen.io/fro...
    #js #scroll #gsap #scrolltrigger

ความคิดเห็น • 38

  • @sean-gs
    @sean-gs 7 หลายเดือนก่อน +3

    Super tutoriel comme toujours ! GSAP devient beaucoup plus clair pour moi, les markers sont super utiles. Je n'avais pas vraiment regardé GSAP auparavant, mais avec les markers, tout devient plus simple dans ma tête ahah.

    • @tutos-front-end
      @tutos-front-end  7 หลายเดือนก่อน +1

      Par contre il faut pas oublier de les enlever une fois en prod ahah 😅

  • @nico77
    @nico77 7 หลายเดือนก่อน +4

    Merci pour la découverte ! J'ai utilisé la propriété "pouceBlanc" parce que j'ai déja utilisé la propriété "abonné".

    • @tutos-front-end
      @tutos-front-end  7 หลายเดือนก่อน +1

      Et la propriété "commentaire" aussi du coup obligé de répondre 😂
      Merci à toi en tout cas 😉

  • @ilhanlaman3395
    @ilhanlaman3395 3 หลายเดือนก่อน

    tes vidéos sont du qualités et d'une qualité d'explication c'est très agréable continus ainsi je me régale

    • @tutos-front-end
      @tutos-front-end  3 หลายเดือนก่อน

      Un grand merci ! Ca fait plaisir 😊

  • @MrFarfadetccc
    @MrFarfadetccc 6 หลายเดือนก่อน +1

    Belle découverte cette chaine, je m'abonne... Merci pour la qualité du contenu

    • @tutos-front-end
      @tutos-front-end  6 หลายเดือนก่อน

      Merci à toi et bienvenue 😉

  • @joannybernardeau8691
    @joannybernardeau8691 4 หลายเดือนก่อน +1

    Merci pour les explications. Je me suis tenté sous react et obtenu de super resultat.

    • @tutos-front-end
      @tutos-front-end  4 หลายเดือนก่อน

      Avec plaisir 🙂

    • @joannybernardeau8691
      @joannybernardeau8691 4 หลายเดือนก่อน

      @@tutos-front-end sous react j'ai du mettre un setimeout comme j'ai vu sous le forum de gsap.

  • @aurelienhouse654
    @aurelienhouse654 7 หลายเดือนก่อน +1

    Tes vidéos sont toujours top, c'est clair et utile. Je kiff

    • @tutos-front-end
      @tutos-front-end  7 หลายเดือนก่อน

      On essai 😅 Merci en tout cas ça fait super plaisir à lire.

  • @CharlesAcoustique
    @CharlesAcoustique 3 หลายเดือนก่อน

    Super vidéo, super chaîne !
    Pour moi qui découvre seulement GSAP et ScrollTrigger, c'est juste ce dont j'ai besoin.
    Hâte de voir les vidéos à venir ! 👍

    • @tutos-front-end
      @tutos-front-end  3 หลายเดือนก่อน +1

      Il y en a eu une depuis sur GSAP😉
      Merci en tout cas 😊

    • @CharlesAcoustique
      @CharlesAcoustique 3 หลายเดือนก่อน

      @@tutos-front-end oui, je l’ai vue aussi, et tout aussi intéressante

  • @NyAinaKadmielRALYANDRY
    @NyAinaKadmielRALYANDRY 3 หลายเดือนก่อน

    très cool merci !!!

  • @engelclaire377
    @engelclaire377 5 หลายเดือนก่อน +1

    Super cool, vraiment merci. La suite vite... 😊

  • @jegg13014
    @jegg13014 7 หลายเดือนก่อน +1

    Super vidéo, toujours clair.
    J'espère que tu vas continuer

    • @tutos-front-end
      @tutos-front-end  7 หลายเดือนก่อน

      Apparemment ce que je propose est apprécié alors non je ne vais pas abandonner 😉
      Merci pour les encouragement 😊

  • @lacazagaming2108
    @lacazagaming2108 7 หลายเดือนก่อน +1

    Le tuto tombe à pic ! j'étais justement en train d'expérimenté ScrollTrigger :D tu as prévu de faire une suite un peu plus avancée ?

    • @tutos-front-end
      @tutos-front-end  7 หลายเดือนก่อน +2

      C'était fait exprès ! Tout était calculé 😅
      J'ai fait ce tuto pour pouvoir en faire d'autres plus avancés plus tard (peut être pas la prochaine vidéo). Ca me permettra de ne pas réexpliquer les bases et de me concentrer sur l'effet que je voudrais présenter. Cette vidéo servira de référence pour ceux qui n'ont jamais essayé ScrollTrigger.
      Donc reste dans le coin, il devrait y avoir d'autres vidéos d'ici peu ! 😉

    • @lacazagaming2108
      @lacazagaming2108 7 หลายเดือนก่อน +1

      @@tutos-front-end au top en tout cas ! 😁

  • @micboydev
    @micboydev 7 หลายเดือนก่อน +1

    Un tuto de qualité !

  • @Margaux34000
    @Margaux34000 6 หลายเดือนก่อน +1

    Super vidéo, ça donne envie d'en voir d'autre. Est-ce que tu as prévu de parler de l'intégration de GSAP sur WordPress ? 🙏😇

    • @tutos-front-end
      @tutos-front-end  6 หลายเดือนก่อน

      Si ça intéresse beaucoup de monde pourquoi pas mais j'avoue ne pas trop touché à Wordpress. Par contre Webflow... 😅

  • @DINODEPISCI
    @DINODEPISCI 18 วันที่ผ่านมา

    Suite la suite reuf

  • @jav_aldu2684
    @jav_aldu2684 7 หลายเดือนก่อน +1

    super cool

  • @DUBOINPascal
    @DUBOINPascal 6 หลายเดือนก่อน

    une vidéo bien faite, claire et synthétique, mais nous sommes noyés par un flot de "moi je… moi je , moi je …" , un petit tic de langage à corriger ;-)

    • @tutos-front-end
      @tutos-front-end  6 หลายเดือนก่อน +1

      Merci Pascal. Oui en effet j'ai certains tics de langage. Je ne suis pas encore super à l'aise de parler tout seul devant mon PC, ça me perturbe. Je suis déjà content d'avoir pratiquement supprimé les "euh" qui m'énervait moi même 😅. Mais j'en ai d'autres malheureusement, comme "donc" ou "ici" et j'avais même pas remarqué le "moi je". Mais à force ça va venir 😉 C'est mon combat 😅

    • @DUBOINPascal
      @DUBOINPascal 6 หลายเดือนก่อน

      cela va se faire j'ai acun doute

  • @florentgironde7279
    @florentgironde7279 7 หลายเดือนก่อน +1

    j'ai quelque chose que je n'ai pas compris. Si je veux utiliser ca sur un site perso ou client, je dois avoir l'abonnement? et si j'arrête l'abonnement donc mon site en ligne perds la fonction scroll? Comment Gsap c'est que j'ai bien payé ?

    • @tutos-front-end
      @tutos-front-end  6 หลายเดือนก่อน

      Non GSAP est gratuit, certains plugins sont payants (comme Morphing SVG, SplitText, etc). ScrollTrigger ne l'est pas. Donc tout ce que j'ai montré dans cette vidéo est gratuit 😉
      Ensuite si tu utilises un plugin payant sur un de tes sites tu auras un gros message d'erreur. Parce que ces plugins envoient une vérification à GSAP avant de s'exécuter. Cela dit tu pourras toujours tester les plugins payant en local ou sur Codepen 😉

  • @bzh5680
    @bzh5680 5 หลายเดือนก่อน

    Salut, j'ai reussi a importer gsap et les animations sur mon site sans framework, est ce que tu pourrais m'aider si tu sais pour importer gsap sur vue js ?merci par avance