Navigation bar hides behind top of the page

bokehlover71

On the Journal gallery style a navigation bar appears if the gallery has several pages. But when I go to a new page, the navbar is hidden below the top of the page. Even a bit of the top pictures are hidden behind the header. I am afraid some visitors get confused when they go to a new page and they can't see the navbar on the top.

Is it possible to do so the navbar takes us to the very top of the page, not only to the top pictures in the gallery?

rainforest1155

Looking at your Favorites gallery in my Safari and Chrome browser, I'm not able to see any issues with the page navigation displayed at top/bottom. Could you take a screenshot of your whole screen showing us what you see? Here's how to take one.
Which browser version and operating system do you use?
Do you have any extensions installed in your browser? If so, which?

bokehlover71

I use Safari, and have the newest Mac OS operating system. The only extension installed is the newest Adblock Plus. But I've had the same issue for years with this gallery style. Here is top of page 3 in my album when I have clicked on the navigation bar. Sometimes it first loads correctly, but after a few seconds, when the page is fully loaded, it jumps up like this:

Here is how the page is supposed to be:

denisegoldberg

I see the same behavior on my site. I also prefer that the page numbers remain at the top - there shouldn't be an automatic scroll that removes them.

bokehlover71

Good to hear I am not alone about this. I hope this could be fixed in a future update, or maybe anyone has a CSS code that can fix it.

denisegoldberg

@rainforest1155 said:
Looking at your Favorites gallery in my Safari and Chrome browser, I'm not able to see any issues with the page navigation displayed at top/bottom. Could you take a screenshot of your whole screen showing us what you see?

You can see this behavior in this gallery on my site - http://www.denisegoldberg.com/Medley/galleries-by-date/n-GzNHG/.

The unwanted scroll happens when clicking to any page other than the first page. The page navigation is initially shown but the page then scrolls to the top of the first photo on that page.

I suspect this behavior is deliberate but I would prefer that it not show the top of the page then autoscroll to the top of the first photo.

Allen

The behavior is deliberate because when going to next pages it positions the next photo. Same as going backwards, it positions the bottom photo of previous page.

bokehlover71

The most annoying thing is probably that if someone starts to scroll down a page before it is fully loaded, it will jump up to start again.

Allen

Actually, Smug needs to fix the current behavior. It does not position the top photo correctly, the top ~10% of the photo is cut off. At least on your gallery. My gallery seems to be correct so it might be your added CSS.

Jtring

@denisegoldberg said:

You can see this behavior in this gallery on my site - http://www.denisegoldberg.com/Medley/galleries-by-date/n-GzNHG/.
The unwanted scroll happens when clicking to any page other than the first page. The page navigation is initially shown but the page then scrolls to the top of the first photo on that page.
I suspect this behavior is deliberate but I would prefer that it not show the top of the page then autoscroll to the top of the first photo.

Interesting. It looks like the second page picture (and ones on later pages) get tucked under your header too, just a little bit. Your header is semi-transparent and not a tall as bokehlover71's so it's not as obvious, but it's the same behavior. (Look at the clouds on the last page of the example.) It appears that SmugMug's logic pays no attention to the pinned header when locating the images on the later pages.

That does suggest a work-around, though: unpin the header. If you don't want to do that site-wide, you can do it on a more limited basis using custom CSS. I have not tested this, but I think something like the following would unpin the header just for galleries. My apologies if this does't work.

.sm-page-gallery .sm-page-layout > .sm-page-layout-region-header.sm-page-layout-region-pinned {
       postion:relative;
}

Alternately, instead of ".sm-page-gallery" you could cite the individual page, ".sm-page-node-XXXXX" where the XXXXX corresponds to the identifier for a given page. Then you could unpin one page at a time.

These are not great work-arounds. SM really has something to fix here. By these might provide partial improvement.