Coder un Indicateur de Scroll en JavaScript

Поділитися
Вставка
  • Опубліковано 30 січ 2025

КОМЕНТАРІ • 22

  • @EcoleduWeb
    @EcoleduWeb  2 роки тому +2

    On peut en effet légèrement raccourcir le calcul en enlevant le "* 100 / 100"
    const percentage = ((window.scrollY - content.offsetTop) / content.scrollHeight).toFixed(2);
    scrollIndicator.style.transform = `scaleX(${(percentage)})`

  • @isa8383
    @isa8383 2 роки тому +1

    Super vidéo encore Enzo , merci 🙏🙏🙏.
    Ce qui est génial c'est que non seulement on apprend des méthodes JS, mais en plus il y toujours cet aspect concernant les performances navigateur. C'est vraiment top 👍👍👍😊

    • @EcoleduWeb
      @EcoleduWeb  2 роки тому +1

      Merci Isa!
      J'essaye de donner le maximum d'infos 🙌🙌

    • @isa8383
      @isa8383 2 роки тому

      @@EcoleduWeb On s'en rend bien compte, c'est aussi pour ça qu'on apprécie ta chaîne et tes cours. 👍👍👍

  • @EasyExplaining101
    @EasyExplaining101 2 роки тому +2

    Merci beaucoup pour cette vidéo.
    Je l'attendais avec ton approche. C'est bien de varier les sources avec différentes explications
    PS: Tu as été courageux de prononcer le mot interdit de nos jours (jQu***) 😃

  • @azertty3302
    @azertty3302 2 роки тому

    tes vidéos sont au top et toujours biens expliquées !

  • @ilanoud8695
    @ilanoud8695 2 роки тому

    Super vidéo comme toujours ! Merci beaucoup !
    Juste une petite suggestion : tu n’avais pas besoin de diviser puis multiplier par 100, ça aurait fonctionné et tu aurais eu simplement 2 décimales au lieu de 4 dans le scaleX 😄

    • @EcoleduWeb
      @EcoleduWeb  2 роки тому +1

      Wops l'étourderie ! Je le rajoute en com épinglé :)
      Merci pour le compliment

  • @menbas
    @menbas Рік тому

    merci pour cette vidéos

  • @nikitakimimaro4361
    @nikitakimimaro4361 2 роки тому

    Au top MERCI

  • @polnio
    @polnio 2 роки тому

    Super vidéo ! J'ai juste une petite question : il y a une raison si à 11:00 tu mets un else if à la place d'un simple else ? Ou c'est juste une étourderie ? (Il me semble que tu avais fait pareil dans une autre vidéo avec intersection observer)

    • @EcoleduWeb
      @EcoleduWeb  2 роки тому

      En effet dans le feu de l'action j'ai mis un else if, on peut mettre un simple else :)

    • @polnio
      @polnio 2 роки тому

      Ah d'accord. Merci !

  • @Soukouna4252
    @Soukouna4252 2 роки тому +2

    Pourrais-tu nous faire une vidéo sur les fonctions min() max() et clamp() en css ?

  • @Soukouna4252
    @Soukouna4252 2 роки тому

    Merci beaucoup

  • @mrs8683
    @mrs8683 2 роки тому

    magnifique

  • @AdaAsh01
    @AdaAsh01 2 роки тому

    Bonjour, j'ai reproduit cet exercice avec succès mais lorsqu'il s'agit de l'adapter sur un autre contenu, la progression s'arrête à 89.97 ... Une idée de ce qui pourrait causer ce problème? (je sais bien que sans le code sous les yeux c'est moins facile mais sait-on jamais.) Je ne sais plus où chercher, merci 🙂

    • @AdaAsh01
      @AdaAsh01 2 роки тому

      J'ai trouvé 😅 apparemment il est très important que le footer soit très grand de façon à faire sortir .content du viewport, si non ça ne fonctionne pas très bien... Merci pour vos tutos 🙂👌💫

  • @diamondsky6605
    @diamondsky6605 2 роки тому

    J'ai toujours trouvé ça cool mais quand on y pense les scroll bars servent aussi à ça 😆

  • @amrabdelfattah3620
    @amrabdelfattah3620 2 роки тому

    RIP¨JQuery

  •  2 роки тому

    On en a jamais eu besoin de jquery c'est les gens qui l'utilise car il ont la flemme d'écrire 2 lignes a la place de 1

    • @EcoleduWeb
      @EcoleduWeb  2 роки тому

      Non, c'était vraiment très pratique pour sélectionner des éléments avant l'arrivée de .querySelector().
      On pouvait aussi l'utiliser pour faire des animations très facilement, etc ...
      Mais le JS Moderne l'a enterré.