search

kindoflew / svelte-parallax

a (small) spring-based parallax component library for Svelte
MIT License
145 stars 5 forks source link

Add transform back #24

Closed nathancahill closed 2 years ago

nathancahill commented 2 years ago

Looks like that is a requirement for using overflow: hidden when children elements use transform. Added back, the demos work correctly now.

kindoflew commented 2 years ago

I think just position: relative is what we needed. I have all demos running and tests passing locally without transform.

I was considering getting rid of it anyway in order to implement a "sticky" layer feature (like those scrolly-telling articles on NYT and pudding.cool). But you can't have position: sticky with a transform above it (and we can't use position: fixed, because we need overflow: hidden).

nathancahill commented 2 years ago

Ah yep, you're absolutely right. I love the position: sticky bit.

kindoflew commented 2 years ago

Thanks for again for the contributions, though!

nathancahill commented 2 years ago

@kindoflew Do you have position: sticky working in a demo? I had tried it before but it anchors to the bottom of the page.

kindoflew commented 2 years ago

I have it mostly working in a local branch. Now that we got rid of the transform, I'll probably finish it up this or next week.

The work in this REPL is what I based it on: https://svelte.dev/repl/bcbfdf1ae4174ebcb384421372f25e23?version=3.46.6