[Resolved] EASY SMOOTH SCROLL LINKS

Home Forums Support [Resolved] EASY SMOOTH SCROLL LINKS

Home Forums Support EASY SMOOTH SCROLL LINKS

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #205136
    Daniel

    I have installed easy smooth scroll link add on and it does not seem to be working with generate press theme I have my page set up as sections see http://perfekttension.com/perfekt-tension/

    Is there a way to smooth scroll to anchors?

    My anchors are on the menu to the section on the page I am not sure if this is issue with the plug in or not

    Is there a way to add smooth scroll to the anchor?

    #205177
    Roberto Enrique

    Place this in your wp-footer hook

    
    <script>
    // smooth scrolling thanks to https://css-tricks.com/snippets/jquery/smooth-scrolling/
    
    jQuery(function() {
      jQuery('a[href*="#"]:not([href="#"])').click(function() {
        if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
          var target = jQuery(this.hash);
          target = target.length ? target : jQuery('[name=' + this.hash.slice(1) +']');
          if (target.length) {
            jQuery('html, body').animate({
              scrollTop: target.offset().top
            }, 1000);
            return false;
          }
        }
      });
    });
    </script>
    
    #205666
    Daniel

    Thanks I did what you suggested but when I click the link to the anchor it just jumps right to that section of the page?

    #205671
    Roberto

    You’re right, it is not working as expected.
    There are some updates to the script, you can find them here:

    http://www.learningjquery.com/2007/10/improved-animated-scrolling-script-for-same-page-links

    #205781
    Tom
    Lead Developer
    Lead Developer

    Try removing the spaces from your IDs and replacing them with dashes.

    #205913
    Roberto Enrique

    I found where the error was. The script actually works.
    But the “J”‘s in jQuery where Uppercase
    they must be Lowercase, so the working script corrected is here:

    
    <script>
    jQuery(function() {
      jQuery('a[href*="#"]:not([href="#"])').click(function() {
        if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
          var target = jQuery(this.hash);
          target = target.length ? target : jQuery('[name=' + this.hash.slice(1) +']');
          if (target.length) {
            jQuery('html, body').animate({
              scrollTop: target.offset().top
            }, 1000);
            return false;
          }
        }
      });
    });
    </script>
    

    you can see a working demo here: http://onepager.artomultiplo.net/

    #205927
    Daniel

    Thanks removing the space worked and the code also worked.

    #206036
    Tom
    Lead Developer
    Lead Developer
Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.