2 different sections overlapping issues

Hi!

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.

This is the read only link:

https://preview.webflow.com/preview/leixida-org?utm_medium=preview_link&utm_source=designer&utm_content=leixida-org&preview=324fcd89b4082f02c0df37f1ad764315&pageId=5ef9e7e0e25cab7247807600&itemId=5ef9e7ed1df59a627377aeaf&mode=preview

So here my questions:

  1. 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.

  2. 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?

  1. 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.

Thanks!

N.


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

try 100 vh again.
change top padding to 62

1 Like

Sorry, It’s working but still having 2 problems then:

  1. 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.

  1. 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?

Thanks iDATUS, really helpfull :slight_smile:

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

If that works and all good give us a heart :wink:

1 Like

issue 1:
working! thanks a lot! I was not seeing the solution :see_no_evil: :heart: :heart: :heart:

issue 2:
I made a video (Recording #2) to show you what I want.

https://drive.google.com/drive/folders/11jbsjbTzrLst0s16vfkALI0f_PQWn_eW?usp=sharing

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.

Many many thanks!!
N.

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 :wink:

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.

I don’t really get what you mean now :thinking:

Cant for the life of me work out how the grid scrolls up the page, your turn to advise me.

I have not used grids so be kind.

Honestly? I have no idea :frowning:

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.

No problems, gives us something to work out.
Going to be busy for a few hours and I will let you know when I am back on it.

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 :wink:
I will take a look again soon.

thanks you iDATUS, very kind :slight_smile:

I seem to get error page 404 now. is something up?

You mean error when clicking on every “cell” of div block courses list ? or when?

anything on the left hand column

I was trying to fix another problem and I think something happened after the code.

Thought that was you posted that.
Well I don’t know what to say.
Let me know when I can click on something.