Abonnez vous au flux !
Abonnez vous au flux RSS de ce blog pour recevoir une notification de votre agrégateur rss lorsqu'un nouvel article est ajouté.
Top clic
Derniers articles
  1. Vous souhaitez égayer la navigation entre les rubriques en y ajoutant un effet de défilement animé (« smooth scroll ») en jQuery ? Voici quelques explications pour l'implémenter dans une page WebDev.
    Rien de bien compliqué à mettre en oeuvre.

    Insérez le script dans votre page

    Insérez simplement ce script dans l'initialisation de la page ou vous souhaitez un scrolling plus 'smooth' qu'un simple repositionnement.

    MoiMême..HTMLEntête += [
            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
            <script>
            $(document).ready(function() {
            $('.scrollTo').click( function() { // Au clic sur un élément
            var page = $(this).attr('href'); // Page cible
            var speed = 750; // Durée de l'animation (en ms)
            $('html, body').animate( { scrollTop: $(page).offset().top }, speed ); // Go
            return false;
    }
            );
    }
            );
            </script>
    ]

    Testons ! (oui c'est tout ou presque)

    Créez une nouvelle page avec un lien en haut, et agrandissez votre page en hauteur pour qu'elle ne s'affiche pas en plein page sur votre navigateur.
    En bas de la page créez un libellé et définissez le comme une ancre (onglet général du libellé)

    Ensuite, ouvrez les paramètres du lien en haut de page, et cliquez sur le bouton 'Autres actions...' et sélectionnez l'option "Se positionner sur une ancre de la page" puis sélectionnez votre libellé qui doit apparaitre dans la liste. Validez

    Dans l'onglet 'Avancé' du lien Ajoutez la classe 'scrollTo' dans la table "valeur ajoutée dans l'attribut 'class' du champ". Validez le tout.

    Testez ! Normalement lorsque vous cliquez sur le lien, la page doit scroller mais pas d'un coup...

  2. Commentaires

  Copyright Service Info 76 - 2018 - Réalisé avec WEBDEV de PC SOFT - Tous droits réservés