Using Hype Sticky Scroll with Blocs App

Hello,
A very nice scroll effect.

In blocsapp - bootstrap 5, I want it to appear anywhere in the page. However, either the scroll effect does not work, or it always starts from the top and even the navigation bar comes out after the scroll effect.
What should I do to show the scrool effect somewhere on the page I want?

Hello Mexmet,

you should upload this to a page, I can inspect. I don't own a Blocsapp license.

Regards

Max

Thanks for your quick turn,
scrollsite.zip (224.9 KB)

You are using:

.page-container {
    overflow: hidden;
}

That is not allowed if you want to use position:sticky as we do with the scroll.

Also, I saw you are pulling in the CDN version and the inline version. One should suffice, best the minified one, but local.

I tried auto visible scroll clip but nothing changed.

Set it to:

.page-container {
    overflow: initial;
}

I tried to change the place in another place :upside_down_face:. Yes, it's done now, thank you very much.

Hey @mexmet . Could you please provide us the latest version of the hype document of your site. It will be better to look if it solves my problem too

Maybe you could explain the issue you are having here and post the problematic project !

1 Like

Hello,

Add the following to your page.


<script type="text/javascript" src="ScrollThroughScenesSticky.hyperesources/HypeStickyScroll.js"></script>

And not as a hype embed in Blocsapp,
With the code widget, place the code in the html after hype export.

It seems you're including a resource in two different ways: once using a relative path and again using a CDN link, which you've commented out with "--". It's important to use only one method to avoid conflicts and ensure the resource loads correctly. Double-check the accuracy of the relative path to ensure it's correct, and if you choose to use the CDN, make sure it's enabled and not commented out.

1 Like

Thank you guys i did it :+1:

1 Like