▼
Streaming live at 10am (PST)

Different Parallax effects possible with Webflow (no custom code required)

Community resources Webflow Tips
#42

From what I’ve read parallax is not supported in mobile browsers due to performance overhead. Same goes with fixed images without some js hacks.

1 Like
#43

It is possible now with IX2. check out this page on your mobile device

2 Likes
#45

This is pure gold :slight_smile:

1 Like
#47

Thanks, this works great on Chrome, but doesn’t seem to work at all on Firefox and Edge. (Can see it on the sample from @sabanna – http://paralax-scroll-effect.webflow.io/)

Specifically, the “Paralax” with slow move up and the “Paralax” with slow move down.

Is there a better way to do this with IX2?

1 Like
#48

Hey, @collabsolutionsmn!

It is because of different browsers renders 3D transforms differently. Unfortunately.

With IX2 it can be done easier, you are right.

#49

@sabanna I think I’ve set this up properly but it seems I am getting a bug or something. I have made a video so you can see what I am talking about: https://www.loom.com/share/59017068ad844a788c4be0c239a96a4c

Here’s my read-only link: https://preview.webflow.com/preview/steakhome?utm_medium=preview_link&utm_source=designer&utm_content=steakhome&preview=6f0390e3fbd30e41a284b46fc47db629&pageId=5dad695c4c72cc57edf64b07&mode=preview

I appreciate your help in advance!

Bec

#50

Hi, @rlowe1228!

My apology for the delay, it seems your preview link is not active anymore. Were you able to figure it out?

Cheers,
Anna

#51

@sabanna no worries! I figured it out :slight_smile: Thanks so much.

#52

@sabanna Hi Sabanna! This is wonderful, thank you. Is there a way to keep the background image from being distorted as the browser is resized? Thank you.

#53

@magicmark Hi Mark, did you ever come up with a solution for this?

#54

Well now we have Object fit, so this would be one solution. Wow, this is an old thread! Great that it’s still useful! :smiley: You know Parallax effects are now able to be created with Interactions 2.0? At the time of this thread that didn’t yet exist in Webflow :slight_smile:

Object-fit property. Select the image and use this feature, you can use 10% width and height on the image (just make sure the parent of the image has height of some sort set). Hope that helps.

1 Like
#55

Oh wow… this changes everything! Hallelujah!

Thanks for sharing. Saved a lot of time and resizes perfectly.

1 Like
#56

My hero of the day! Thank you so much Sabanna

#57

this awesome and beautiful my friend

#58

Great stuff, but “Slow Move Up” unfortunately not working with WIN Firefox Version 89…