Scrollbar fill on scrolling page

Hi, I saw this: https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_scroll_indicator

And I tried to make it work in Lectora, but somehow the script won't run when I have it either in meta tags undefined tages, in the header scripting nor in the bottom of file scripting.

Anyone has a sollution for this?

(I used custom div for the scrollbar with the html code for the progress container and bar, but if there's a sollution with the Lectora progress bar that's also fine for me.

Discussion (5)

Adding the event listener to the window should happen in a Run javascript action or another type of trigger. Otherwise the code won't be executed.

Fantastic, thanks!

Seems it only works if I don't load jQuery via a html extension.

I have a little code that scrolls to the top (we use long pages):

function STT() {

$('html, body').animate({scrollTop: $('#pageDIV').offset().top -50 }, 'slow');

}

Now that obviously doesn't work anymore. You have any idea how comes that loading jQuery doesn't let the scrollbar code work?

This code works for most modern browsers and is a fix for now:

window.scroll({ top: 0, left: 0, behavior: 'smooth' });

Wonder still though if you know a solution wiht jQuery loaded and the old code :)

undefined

Kind regards,

George

Where did you put jQuery? I tried but I can't recreate the issue.

I saw what happened, and what fixed it.

My code of adding jQuery was in a header scripting element, when I changed it to meta tags, everything was fine.

undefined

Edit, thanks for your file, I'll look around on where to put what :)

Discussions have been disabled for this post