I’m trying to overlap 2 sections while scrolling and I think I almost have it, but not yet. There are some issues that I need to solve and I don’t know how.
I need help to re-estructure the layers and elements of the because it looks like it’s working properly but I know there are some layers that are not need it, but if I remove them, then the efect is not working and I don’t know how to fix it.
Also I need that the 2 sections are full screen size, but starting from the bottom of the menu until the end of the screen, not from the top of the screen, so 100vh doesn’t work for me.
I managed to do it aproximately with 91vh, but it’s not well done and I can see the borders doesn’t fit. Is there any way to do that?
Why when I click in a collection item list, the page scrolls up to the begining instead of staying in the 2nd section? The information I need to show when I click on top of an element of the list, is contained in the block next to it: Div Block Info Courses.
Sorry, It’s working but still having 2 problems then:
The border of the second section is now 62px over the content. How can I fix this if I apply a padding? I need the border just on the perimeter of the content.
When I click in a collection item list, the page scrolls up to the begining of the page (top) instead of staying in the 2nd section. The information I need to show when I click on top of an element of the list, is contained in the block next to it: Div Block Info Courses. How can I fix this?
Sorry having trouble working out what you mean.
Got it now. you mean the black bar.
Give me a sec.
We are getting there.
2. once on top you want it to stay there and not move?
ok fixed issue 1.
All about borders.
information center - top border off
div block courses list - top border 5pxl
div block info courses - top border 5pxl
Programa - top border 5pxl
Because the 1st section (Div Block Section / Image) it’s a presentation, and the real content is located in the 2nd section (Div Block Section / info), after scrolling down I need to stay there, in the Div Block Section / info, and when I click on every collection item on the left collection list, stay there and see the info next to it (Div Block Info Courses).
This actually comes with a 3rd issue:
You can check the video (recording #3). Maybe I need to add an interaction that starts when I start scrolling down and push up the 2nd section, but I don’t really know how to do it. I’m gonna try.
It’s a bit difficult to explain, I hope you understand my chaos in mind.
I can see you have put a lot of work into so I understand your frustration.
Just remember you are close to it, anyone looking is new and its not always easy to pick up your issues 1st time. I am not an expert but actually really enjoying helping, I learn as well.
So looking at problem number 2. see what I can do…
PS give us a heart for fixing option number 1
ow here is a thought,
Hide section 2 (the real one) scroll up a picture to the top and then hide it and show the real one.
That just off the top of my head mind you.
Because the brand of this client was designed with grids, I had to design the website within the same concept, and it was the first time I used webflow, so I had so much troubles to adapt everything into grids. I have no idea how to scroll up the page, I was thinking maybe with interactions but it didn’t really worked out what I tried.
I found this! And this is the scrolling effect that I need!
Not working all the time, I don’t know why… Might be a code issue?
And also, when I do scroll up, and the 2nd section remains on the screen, if I want to scroll up/down inside the internal divs, all the section rolls up, so I can’t dive into the divs. Not really working…
I found him earlier and subscribed. He said he will become active again.
So this has code, obviously and I am at this moment a no code guy.
It does not mean I am not codist
I will take a look again soon.