Intégration Jquery dans JS

Bonjour,
il me semble bien oui, 2 fois même, en local et en demote :

<script src=mini_jquery.js></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>  
<script src=app.js></script>
</body>
</html>

je ne comprends pas

ah cool super merci.

Et si quelqu'un veut bien prendre 5 min pour m'expliquer ces histoires de performance je suis toujours chaud pour apprendre.
Peut-être qu'il y a mieux a faire.

Pour l'instant j'en suis là :

je bloque sur effet slide-in en fin de page. Voici mon code :

Voici mon code CSS/Javascript :

CSS

body {
    position: relative;
    margin: 0;
    padding: 0;
    background-color: white;
    color: black;
}

body:before {
    position: absolute;
    content: '';
    top: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
   background: linear-gradient(0deg, rgba(218,136,136,1) 0%, rgba(255,255,255,0.5066759980359331) 34%);
   transform-origin: 0 bottom 0;
   transform: scaleY(0);
   transition: .4s ease-out;
  }

  body.bc {
    color: white;
    transition: color .4s ease-out;
    z-index: -10;
    
  }

  
  body.bc:before {
 transform: scaleY(1);
 z-index: -10;
  }

JS/JQuery

window.onscroll = function(ev) {
    if ((window.innerHeight + window.scrollY) >= document.body.scrollHeight){
        $('body').addClass('bc')
    }
    else{
        $('body').removeClass('bc')
    }
};

C'est déjà assez proche du résultat souhaité. Maintenant ce que j'aimerais faire c'est jouer sur le scroll, un peu comme un effet parallaxe. C'est à dire qu'au lieu de déclencher l'animation à la condition if qui vient chercher la butée du scroll en fin de page, j'aimerais que l'animation suive la barre de scroll sur les derniers centimètres de la page. Cela donnerait la sensation de pouvoir jouer avec le scroll pour interagir avec la page.

Je ne fais que débuter sur JS ; Merci d'avance pour votre aide


Bonne journée !!

Salut,
La fonction getGradientColor renvoie un nouvel objet à chaque fois qu'elle est appelée. Cela peut se produire plusieurs centaines de fois selon la vitesse de scroll. Ces objets n'ont plus d'utilité lorsqu'ils sont écrasés par l'appel suivant dans l'attribut background et l'espace mémoire qu'ils utilisent est perdu au lieu d'être réutilisable.

En réalité, ça n'a pas d'importance car les langages de haut niveau fonctionnant dans une machine virtuelle comme Javascript, PHP, C#, Java, Ruby, Python, etc. possède un ramasse-miette. Ce ramasse-miette scanne les variables créées, détecte celles qui ne sont plus utilisées et libère la mémoire occupée. En revanche, pour des langages sans ramasse-miette comme le C ou le C++, il faudrait détruire l'objet avant de l'écraser.
Modifié par Ostara (01 Jul 2020 - 13:09)