Slidebars icon indicating copy to clipboard operation
Slidebars copied to clipboard

Anchor links with fixed header leads to strange results

Open harberg opened this issue 8 years ago • 1 comments

Hello,

I have a one page site that has a fixed header with anchor links in the nav. The first time I click the anchor link the page smooth scrolls to the correct place, but after that is when things get weird.

  1. After the page has initially scrolled to the section I want, if I click the same link again in the fixed header, the page scrolls all the way to the top.

  2. After the page has initially scrolled to the section I want, if I click a different link it then goes to a spot that isn't the actual anchor that I am targeting. It seems that the offset is being measured off the view port and not the actual size of the page.

I'm using a standard implementation of Slidebars version 2.0.2.

Here is the smooth scrolling code that I am using (from CSS Tricks, of course).

$('a[href*="#"]:not([href="#"])').click(function() {
     var pageHeight = {
         height : $(document.body).height()
     };

     var height = pageHeight.height;
     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) {
             if(height < 4000) {
                 $('[canvas="container"]').animate({
                 scrollTop: target.offset().top
             }, 1000);
         } else {
             $('[canvas="container"]').animate({
                 scrollTop: target.offset().top
             }, 4000);
         }
       return false;
         }
     }
 });

harberg avatar Jun 15 '17 16:06 harberg

Hey you already got a solutions? Because I have the same problem.

VincentVanDenBossche avatar Oct 11 '17 12:10 VincentVanDenBossche