Issue with the UKBF site

[James (iimttd)]

I'm having an issue with the UKBF where you need to scroll quite a bit to get the sticky header to do its things and allow to scroll:

For whoever needs it:
Chrome Version 98.0.4758.109 (Official Build) (x86_64)
MacOS 11.6

 

[Ozzy]

I'm having an issue with the UKBF

Any chance you could do a full screen recording so we can see where the scroll bar sits with the rest of the page to try and recreate this?
Happy for you to email it so [email protected] if easier/prefer.

Tagging @Ethan39 to pick this up.

 

[James (iimttd)]

Sure, I'll close any incriminating tabs/code shortly. ?

 

[Ozzy]

Sure, I'll close any incriminating tabs/code shortly. ?

Spoil sport ??

 

[James (iimttd)]

ok so here is the original:

Watch Screen Recording 2022-02-25 at 12.16.47 | Streamable

Watch "Screen Recording 2022-02-25 at 12.16.47" on Streamable.

streamable.com

then, locally i removed all JS and plumbed in some css/js to 'debounce' the scrolling. This is more of a test, so not producion ready by any means but:
$(function() { var header = $(".p-navSticky"); $(window).scroll(function() { var scroll = $(window).scrollTop(); if (scroll >= 1) { header.addClass("is-sticky"); console.log("yes"); } else { setTimeout(function() { header.removeClass("is-sticky"); }, 100); //header.removeClass("is-sticky"); } }); });

helps:

Watch Screen Recording 2022-02-25 at 12.47.09 | Streamable

Watch "Screen Recording 2022-02-25 at 12.47.09" on Streamable.

streamable.com

 

[James (iimttd)]

oh, and CSS .p-navSticky{ display:sticky; //to be sure height:100px; //test } .p-navSticky.is-sticky{ height:60px; //smaller test } .p-nav,.p-nav-inner{ height:100% !important; //set these to parent height for simplicity }

 

[Ozzy]

Dude, what you got running? ?
Why the site so broken on your browser, logo and menu icons and breadcrumbs all broken.

Either way one of site devs will take a look.

 

[James (iimttd)]

Dude, what you got running? ?
Why the site so broken on your browser, logo and menu icons and breadcrumbs all broken.

Either way one of site devs will take a look.

The latter is me running the site with all javascript removed for testing, which means the icons, etc. wont render. The main issue looks like the offset gets messy at the moment, so I made it that the scroll down initiates the sticky header but only allows it back to the initial after 100ms, effectively debouncing the css.

 

[fisicx]

I've just tested the site on Firefox, Chrome, Edge, Safari and Brave and can't replicate the issue. It's all working as it should for me on Mac, PC, iPad and Android phone.

 

[James (iimttd)]

I've just tested the site on Firefox, Chrome, Edge, Safari and Brave and can't replicate the issue. It's all working as it should for me on Mac, PC, iPad and Android phone.

Oddly, if i use a magic mouse or touchpad it's fine. Any non apple mouse and off it goes.

 

[SEODEV#338055]

I'm having an issue with the UKBF site

You get asked to create tags but you can't create tags unless you pay for them

This defeats the purpose of being asked to create tags

It also negatively affects the SEO of the forum

But what do I know?