18008 sujets

Questions générales et questions de débutants

Intégration Jquery dans JS

Bonjour,
Je suis confronté à un problème que je ne comprends pas :
lorsque j'intègre le code suivant https://jsfiddle.net/xk8qb39j/ à mon javascript j'obtiens un message d'erreur m'indiquant "jQuery.Deferred exception: $.Color is not a constructor" alors que le code marche très bien sur jsfiddle. Pourriez-vous m'éclairer ?

merci beaucoup,

Bonne soirée
Modérateur
Et l'eau,

new color + new color + new color+ new color+ return new color+ new color + etc. (Paye tes fuites mémoires.... Pour les perfs bonne chance)
Modifié par niuxe (29 Jun 2020 - 18:29)
Merci pour cette réponse rapide. Pourriez faire preuve d'un peu plus de pédagogie ?
De toute façon la perf est nulle puisque ça ne fonctionne pas, le problème étant que new $.color renvoie une erreur.
Bonjour, avez-vous bien inclus une balise script pour intégrer J-Query à votre page ? Sans cela, $.Color ne sera pas défini, d’où l’erreur.
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 Smiley decu
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 Smiley smile


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)
Sujet clos
Aller à