Streaming live at 10am (PST)

Center section on smooth scroll


#1

Hi guys!

I’m trying to center each section in the middle of the screen when user scroll through the page.
I did read the topic: https://forum.webflow.com/t/center-a-section-on-smooth-scroll/1495 and did add a new custom attribute called data-scroll and set its value to mid for each section. But it doesn’t help.

Here is my site Read-Only: https://preview.webflow.com/preview/4pixos-version-2?preview=de6af0d0cd2dacb568447a70578cc76c

Any suggestions?
Thank you.


Uber thinks inside the Box For This Site
#2

Did you add an ID to each element that you’re targeting?


#3

I didn’t but after reading your reply, I’ave add ID to each section.
However, it didn’t work neither.

Anythings else that I should try?


#4

@thangbe I think I’m trying to do the same thing and the difference with the other thread’s reference is that it demonstrates how to align the smooth scroll target to centered on the element but what we want to do is make the smooth scroll activate on mouse scroll rather than a clicked anchor. Kinda like this, right? http://www.jackdecaluwe.com


#5

Yes good question @effixx@thangbe is the: http://www.jackdecaluwe.com what youre trying to accomplish?


#6

Yes, it is.

@callmevlad since you are an expert on this scroll issue, could you take a look at the website http://www.jackdecaluwe.com and give us some advise?

Thank you a lot!


#7

Hi @thangbe I like that site effect too… Currently the only way to “auto scroll to a section” is with a click trigger… To use a scroll trigger you will need a bit of custom code. There have been discussions on this:

Now these are slightly old discussions but they can still be deployed with a little snippet insertion.


#8

Hi @garymichael1313

I sincerely appreciate you taking the time to look up the forum and send me the discussions. Thank you so much.

Absolutely will try these and I’ll let you know if it works with me.

Good day!


#9

@thangbe … no problem have a great weekend!


#10

I think the data-scroll=midthing doesn’t work anymore.

I had it working on this demo I’m sure (link to green section)

http://inb4.webflow.io/menus-smooth-scroll-stage


#11

@vincent … I don’t think on the body does either… I tried it a number of ways to no avail.


#12

But for what you look to do, you can place dummy elements (empty absolute divs) as targets.


#13

The data-scroll-time on the body. That doesn’t work anymore I don’t think.


#14

This topic was automatically closed 125 days after the last reply. New replies are no longer allowed.