11485 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

Je suis en train de concevoir un site dont voici la démo : http://demo2-onirisweb.com

J'ai mis un bouton pour revenir en haut de ma page. Jusqu'ici pas de problème.

J'ai voulu rajouter un bouton pour atteindre le bas de ma page, mais là, l'animation ne fonctionne pas. Voici mon script Jquery :


<script type="text/javascript">
    // Assuming jQuery.noConflict(); has been called
    jQuery(function () {
        jQuery(document).ready(function () {
            jQuery("#back-top").hide();
            jQuery(function () {
                jQuery(window).scroll(function () {
                    if (jQuery(this).scrollTop() > 200) {
                        jQuery('#back-top').fadeIn('slow');
                    } else {
                        jQuery('#back-top').fadeOut('slow');
                    }
					 if (jQuery(this).scrollTop() < 200) {
                        jQuery('#back-bottom').fadeIn('slow');
                    } else {
                        jQuery('#back-bottom').fadeOut('slow');
                    }
                });
                jQuery('#back-top a').click(function () {
                    jQuery('body,html').animate({
                        scrollTop : 0
                    }, 1300);
                    return false;
                });
				      jQuery('#back-bottom a').click(function () {
                    $("html, body").animate({ scrollTop: $(document).height() }, "slow");
	        return false;
                });

            });
        });
    });
</script>	



Je ne suis pas un grand spécialiste de ce code, donc je vous remercie d'avance pour votre aide Smiley smile
Modifié par 6l20 (04 Sep 2015 - 18:44)
Salut,
De mon côté ton script fonctionne, sur ta page de démo l'animation est bien effectuée et on remonte bien en haut de page. Chrome/Desktop.

Sur quel navigateur as-tu testé ?
Modérateur
Salut,

C'est l'animation pour descendre qui ne marche pas je crois.
Celle pour monter marche bien mais celle pour descendre saute sans animation.

Tu as une erreur Js Uncaught TypeError: $ is not a function sur la ligne :
$("html, body").animate({ scrollTop: $(document).height() }, "slow");

Tu utilises jQuery() partout sauf là ou tu pars sur des $()
Modifié par _laurent (04 Sep 2015 - 15:12)
Merci pour vos réponses.

@MatthieuR je suis sur FF

@_laurent merci pour cette indication, j'ai remplace cette ligne de code par :

 jQuery("html, body").animate({ scrollTop: jQuery(document).height() }, "slow");


Maintenant ça fonctionne Smiley smile

Merci encore