11493 sujets

JavaScript, DOM et API Web HTML5

Bonjour
je teste ici sur un projet http://nauticeayachting.fr/nauticea/ un effet sur scrolling pour ajouter une classe css .tiny ( je veux réduire la hauteur et taille de header et logo ) mais aucun effet ne s'affiche
<script type="text/javascript">
jQuery(window).scroll(function() {
var scroll = jQuery(window).scrollTop();
if (scroll >= 120) {
jQuery(".u-header").addClass("tiny");
jQuery("nav.u-menu").addClass("tiny");
jQuery(".u-logo").addClass("tiny");
if (scroll <= 120) {
jQuery(".u-header").removeClass("tiny");
jQuery("nav.u-menu").removeClass("tiny");
jQuery(".u-logo").removeClass("tiny");
}});
</script>
la console m'affiche une erreur que je ne comprends pas ... car ce code marche sur d'autre site ...
la classe
/*begin-variables custom-site-css*/
.u-header.tiny{
box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.5);
-ms-transform: scale(1, 0.7);
-webkit-transform: scale(1, 0.7);
transition: all 0.5s ease;}
}
.u-logo.tiny{
-ms-transform: scale(0.7, 0.7);
-webkit-transform: scale(0.7, 0.7);
transition: all 0.5s ease;}
nav.u-menu.tiny{
-ms-transform: scale(0.7, 0.7);
-webkit-transform: scale(0.7, 0.7);
transition: all 0.5s ease;}

Bref si quelqu'un a deux mn pour m'aider ce serait sympa
merci d'avance
bonjour
merci de vous intéresser a mon problème !
j'ai modifié :
<script type="text/javascript">
jQuery(window).scroll(function() {
var scroll = jQuery(window).scrollTop();
if (scroll >= 120) {
jQuery(".u-header").addClass("tiny");
jQuery("nav.u-menu").addClass("tiny");
jQuery(".u-logo").addClass("tiny");
if (scroll <= 120) {
jQuery(".u-header").removeClass("tiny");
jQuery("nav.u-menu").removeClass("tiny");
jQuery(".u-logo").removeClass("tiny");
}})
};
</script>
mais toujours pas de résultat ... et toujours cette alerte sur la console ...
D'autant plus bizarre que cette solution fonctionne bien dans d'autres de mes sites
Merci
Modérateur
Bonjour, je dirais à vu de nez qu'il manque un ;
edit: tout compte fait il y a un ) en trop plutôt.
edit2: pas en trop, au mauvais endroit.

Mais le code est mal indenté, c'est difficile à voir.

Utilises un éditeur qui te montres quel ouverture correspond à quelle fermeture, t'aide pour l'indentation. Sinon indente manuellement très précisément ton code, sinon ce genre d'erreur tu en auras tout le temps.
Modifié par kustolovic (29 Aug 2019 - 13:21)
jQuery(window).scroll(function () {
		var scroll = jQuery(window).scrollTop();
		if (scroll >= 120) {
			jQuery(".u-header").addClass("tiny");
			jQuery("nav.u-menu").addClass("tiny");
			jQuery(".u-logo").addClass("tiny");
			if (scroll <= 120) {
				jQuery(".u-header").removeClass("tiny");
				jQuery("nav.u-menu").removeClass("tiny");
				jQuery(".u-logo").removeClass("tiny");
			}
		}) // la parenthèse est en trop ici. tu ferme l'accolade pour le IF mais la parenthèse doit être après l'accolade d'après.
};//ici pour fermer le scroll()
Meilleure solution
Good !!! Merci Jencal

voila mon code final

  <script type="text/javascript">
        jQuery(window).scroll(function() { 
        var scroll = jQuery(window).scrollTop(); 
        if (scroll >= 180) { 
                jQuery(".u-sticky").addClass("tiny");
				jQuery(".u-logo").addClass("tiny");
        if (scroll <= 250) { 
                jQuery(".u-sticky").removeClass("tiny");
				jQuery(".u-logo").removeClass("tiny");				
                                         }}};)
    </script>

Modifié par bretweb (30 Aug 2019 - 11:10)