Independent Scroll?

Hello, I have a doubt regarding my website that seems to be simple to solve with some coding knowledge (which I happen to have zero haha).

As you can see in the image attached below, I have divided its content into 3 main columns (yellow-right + black-middle + yellow-left).

Yellow-left column is fixed above all pages. What I wanted to do was to make black-middle column and yellow-right column scroll independently of each other. That is, if I scroll with my cursor over one of these columns, only that one will scroll down while the other remains in its place. How do I do that with coding?

Thanks in advance, guys!

Hey, without code, this would not work.
Maybe you could hack around it by deviding your website into 3 seperat projects and on one, you have your leftfixed content. On one the centered part and another one the left side.
Then on your first one insert your second project as an iframe and so on… implementing an iframe isn´t complicated. But this is the only solution with just a tiny bit of code.

In general, if buidling a website manually with code you would set it up as three divs, which has a larger content than the parent div. With the css rule overflow:scroll to the div you would then be able scroll only this content. But as readymag isn´t working like this, this is not possible.

What I would suggest, if you want to add some dynamic animation to it is to have the two right columns have a different down-scrolling speed. Just play around with the on scroll-movedown animation and its speed.

1 Like

What about iframe embeds (comes with Business plan)? You can create a section on one project and embed it as an iframe on another. It is a bit overkill but technically it should work.

1 Like

What you mean by Readymag isn’t working like this?

in readymag you are placing the elements in the designer and readymag is doing the structure in the background.
So you are not able to build such scrollable container with RM inbuild design possibilities as you will not get them into a parent container.
What would work is to build it manually inside a custom code widget. So pure html and css codem, manually written for each of the three containers… But then you will not be able to use Readymags strength - the easy “what you see is what you get” designer.

Then I would suggest to use some other builder as it would be a really hacky and rocky way to get this work like a charme in RM.