One Page scroll to nav

1

Can anyone suggest a good scroll-to navigation js-plugin that work well with roots? I’ve tried a couple and the just not playing ball. It’s for a one page site and it would be great to get it integrated.

2

What plugins have you tried that don’t work?

3

Here’s a simple one I put together that’s really lightweight.

The way I’ve got it set up it only looks for links in the .navbar

$(function() {
  $('.navbar a').click(function() {
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
      var target = $(this.hash);
      target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
      if (target.length) {
        $('html,body').animate({
          scrollTop: target.offset().top -200
        }, 500);
        return false;
      }
    }
  });
});
3 Likes
4

Cheers wynnepiriini that worked great!! I owe you a beer :smile:

1 Like
5

I would still like to know which plugins you tried that didn’t work to make sure Roots isn’t the culprit with any plugin conflicts.

6

Hi Ben, I used http://www.outyear.co.uk/smint/ and http://trevordavis.net/blog/jquery-one-page-navigation-plugin/ but it might be that I have conflict with the slider I was using http://codecanyon.net/item/slider-revolution-responsive-wordpress-plugin/2751380?ref=themepunch

Final site http://acorn.beeblu.co.uk/