Snap Scroll bric custom classes

I am testing out Snap Scroll bric. Do anyone know how to do any of the following?

How can make the page transitions smooth?

How can the scroll stop and start on each blocs?

Is there a custom class I could add to hide or changes the dots, dashes and or backround?

Is there a way to change the size and, or color of the indicators, like dots or dashes and their background?

Are there custom classes that can control the height or placement, settings: mandatory or any other ways to manipulate the settings?

Thanks so much for anyone’s willingness to help.

Browser inspector reveals all.

Make it as awful or as nice as you like

Screenshot 2023-03-24 at 3.52.05 PM

I tried to identify the classes in the inspector, but I am not how to recognize them or what they control.

I won the awful trophy! :trophy: :grin:

1 Like

Did you style the text?

Nope. I’m too lazy for that today. My pool is calling me! :rofl: :palm_tree: :coconut: :bikini: :shorts: :swimming_man:

1 Like

Dinner time here.

1 Like

I will give you a nice trophy, when you name the custom class that control that area. :slight_smile:

Like Pete said, it’s all in the code. Check the classes below in the code to see what gets applied. You can even use the inspector to change the css values and see how it affects the look.

snap-scroll-pagination
snap-scroll-paginate-bg
snap-scroll-pagination a .hover-text
snap-scroll-pagination a:after
snap-scroll-pagination a.active:after

Example: to change the look from circles to squares, just remove set the border radius on this class to zero:

Screenshot 2023-03-24 at 22.11.41

You can of course just add those classes to the class manager and poke their settings randomly, but without knowing what each class really does, that’s prone to annoy you.

Snap Scroll works best if you have a page with full height blocs.

1 Like

Wow, Fynn that was really cool of you to share, what I could not find. Actually, I did .snap-scroll-pagination. :slight_smile: I click on the snap scroll bric and applied it. I tried to change various thing, but it did nothing. That is why I started this post.
Thanks to you, I am going to play around with the info you so kindly shared.

1 Like

You’re welcome. Enjoy :slight_smile:

I don’t see this one in the list scroll-snap-type: y mandatory; is that a class or part of the CSS

Where do you see that?

It’s a CSS property. But I do not think Snap Scroll uses it.

I was talking about in your project.

Lots of ways to make stuff. Snap Scroll doesn’t use it.

Thanks, Pete.
I was just trying to figure out a way to stop and start the transition from one bloc to the next. I thought this might work.