Hi! First of all, thanks to the Hype Comunity, always I have had a question, quickly I've had an answer, and this is awesome!
Now, I've got a challenge for all of you: how can I do on Hype, something like this, showed in the picture?
Thanks a lot to all of you!
Enrique,
Barcelona.
Ohhh! awesome!
Now, I would need to hide and show the scrollbar if I am above or outside the text, through javascript, can it be possible?
Thanks!
Setting the content overflow to "Scrollbars" or "Auto Scrollbars" uses the standard macOS system scrollbars. These may be selectively visible depending on the user's "Show scroll bars" setting in the System Preferences General pref pane.
If you want to use non-standard scrollbar styling and behavior, you'll need to code this yourself or fine a library. Scrollbars can be styled purely with CSS, but to get the hover behavior I think you'll need to use JavaScript (and of course mobile is something to consider). There might be scrolling libraries out there already that do what you want.
Generally integrating them with Hype isn't too hard -- it usually involves setting a class name in the identity inspector, adding the .js file to the resources library, and perhaps running a little bit of code on scene load. We can probably give some pointers if there are issues getting it integrated.
I generally advise against overriding system behavior of just setting content overflow unless you have a really good reason though!
If you need a consistent look you could think about a third-party solution, but it would require some programming… see something like this:
https://kingsora.github.io/OverlayScrollbars/
There are also some approaches with CSS, but they require pretty modern browsers:
https://www.w3schools.com/howto/howto_css_custom_scrollbar.asp
1 Like
You may be able to use js with waypoints and on click to change the content overflow to scrollbars or hidden