11521 sujets

JavaScript, DOM et API Web HTML5

Compatibilité de waypoints.js avec jquery-3

Bonjour,

j'utilisais waypoints-2.0.2.js avec jquerry-2.2.4.js sur un site onepage afin de modifier le body et le lien du menu suivant la section affichée.
Utilisant maintenant jquery-3.1.1.js j'ai donc voulu utiliser la nouvelle version de waypoints-4.0.1.js ( http://imakewebthings.com/waypoints/guides/jquery-zepto/ ).
Mais le script ne fonctionne plus.
Comment devrai-je modifier mon script en conséquence? Je suis preneur de toute explication ou conseil.
Merci
Cordialement
Extrait du code html:

<body class="section1-visible">
   ........
    <nav class="">	
            <a class="target-section1 current" href="#section1">Accueil</a>
            <a class="target-section2" href="#section2">A propos</a>

Le script utilisé:

$(function() {
     $('nav.menu a').click(function(){
		$('html, body').animate({
			scrollTop: $( $(this).attr('href') ).offset().top
		}, 500);
	});
	
	var currentSection = "section1";
				
	function change($section){
		$('nav.menu a').removeClass('current');
		currentSection = $section.attr('id');
		$('body').removeClass();
		$('body').addClass( $section.attr('id') + '-visible' );
		$('.target-'+currentSection).addClass('current');
	}
	
	$("#main section").waypoint( function( direction ) {
		if( direction === 'down' ) {
			change( $( this ) ); 
		}
	}, { offset: '20%' } ).waypoint( function( direction ) {
		if( direction === 'up' ) {
			change( $( this ) ); 
		}
	}, { offset: '-20%' } );			

	
	$( window ).on( 'debouncedresize', function() {
		$('html, body').animate({
			scrollTop: $("#"+currentSection).offset().top
		}, 500);
	} );
});

Modifié par Felipe (16 Mar 2017 - 09:51)
Administrateur
Bonjour,

est-ce que les exemples de l'auteur fonctionnent avec jQuery 3.x ?
est-ce que ton code fonctionne avec jQuery 2.x et la dernière version du plugin ?
edit : est-ce que la console (F12) de ton navigateur se plaint de quelque chose ?

Sinon tu peux ouvrir une Issue sur GitHub (in english) ; la seule trace de jQuery 3 que j'aie aperçu en survolant issues et pull request (ouvertes ET fermées) est https://github.com/imakewebthings/waypoints/pull/430 ça semble pas indiquer de souci particulier avec jQuery 3 (enfin plus).
Modifié par Felipe (16 Mar 2017 - 09:58)
est-ce que les exemples de l'auteur fonctionnent avec jQuery 3.x ? non
est-ce que ton code fonctionne avec jQuery 2.x et la dernière version du plugin ? non
est-ce que la console (F12) de ton navigateur se plaint de quelque chose ? non

Je vais suivre ton conseil en postant une issue sur Github.
J'irai revoir aussi sur le site de l'auteur
Sujet clos
Aller à