Vanilla js static page example

[pickethic]

Is it possible to create an example for vanilla js static page?
https://github.com/KingSora/OverlayScrollbars/tree/master/examples/overlayscrollbars - trying to make it work as static page is complicated and removing any div from the page can make the body scrollbar disapear.

[KingSora]

@pickethic Good day :)

I've created a simple example here: https://stackblitz.com/edit/vitejs-vite-jcz9h3
Basically took the vite starter project and added OverlayScrollbars to it.

[pickethic]

Hi thanks a lot :)
Still, there is an issue :D
I mean, whenever I remove the import counter.js or the button for it, the scrollbars disapears completely.
Not really sure why and how are they connected.

[KingSora]

@pickethic They are not really connected in any way.. I've updated the example and removed the counter + button :)
https://stackblitz.com/edit/vitejs-vite-jcz9h3

[pickethic]

Thanks a lot again.
It works for my static page properly.
The thing though is that I am only able to make it work this way:

import { OverlayScrollbars } from "./scroll.js";

// initialize overlayscrollbars
OverlayScrollbars(document.body, {
  scrollbars: {
    theme: 'os-theme-light',
  },
});

while the scroll.js is actually this file:
https://cdnjs.cloudflare.com/ajax/libs/overlayscrollbars/2.8.0/overlayscrollbars.mjs

It works and is satisfying to me the way it is, but I'm pretty sure there are also other people trying to wrap them head around how to make this version work:

https://cdnjs.cloudflare.com/ajax/libs/overlayscrollbars/2.8.0/browser/overlayscrollbars.browser.es6.min.js

Not really sure how to implement the cdn version from the docs part "Manual download & embedding" which would be probably more appropriate way to implement it in plain html, css, js static site.

I think the most basic example ever, even single html file, using the CDN version with manual embedding would be very useful. I would gladly help in creating that.

[KingSora]

Ah sure! I hope this helps now: https://stackblitz.com/edit/stackblitz-starters-yafzyo?file=index.html

[KingSora]

Also, I'll try to improve the docs in this area... thanks for the input :)

[KingSora]

@pickethic I've added an Browser Example to the examples as well as an corresponding link to it in the README in the Manual download & embedding section.

[pickethic]

That's great! Couldn't be more simple. 😀🙏
I'm sure it will be useful.
Only tiny improvements could be considered.
Favicon and logo urls are missing "./public" prefix, and probably removing unnecesary files

.gitignore
package-lock.json
package.json
vite.config.js

would help clarifing things.
Thanks for the comprehensive response, good day! :)

[KingSora]

@pickethic I'm still using vite to verify the example is working so some of the files are needed for that :)

Glad I could help!