Streaming live at 10am (PST)

Interactions don't work on mobile, but do on computer web version


#1

help!

My interactions don't work on my mobile, but do on the web, I didn't change the settings in the mobile version so don't they work?

http://www.dutchmansgoldthegame.com/


#2

Hi,

The onScroll interactions are disabled for mobile because of some issues with mobile browsers.


#3

so how do enable it? or can't I enable it


#4

I tried to remove the interaction on mobile and do something else, but then it removed it across all the devices, how do I solve this??


#5

Interactions can't be removed for devices or desktop... they're not part of CSS properties. Either they're on, or they're off, for all breakpoints.

Interactions with onScroll triggers are disabled for mobile and there is nothing you can do about it, it's by Webflow's side and we can't modify this.


#6

Hi @Aimanisms, there are different ways to get things working on mobile in the design. One quick suggestion is to create two versions of the elements that are dependent on having the scroll animation work in desktop and not run in mobile views. Make the items that should have interactions visible only on desktop view, and the elements to display on mobile, set with no interaction and shown only on mobiles views from Visibility settings in the settings panel. I hope this helps, Cheers, Dave.


#7

ah that is too bad. I didn't know this. So how can we make the mobile interactive, since that is what webflow is all about? Or can't it be done?


#8

I did that @cyberdave thanks, that worked.


#9

Hi @Aimanisms, the scroll interactions are disabled on mobile, but other interaction triggers still work. This will be the case until we update the scroll triggers on tablet and lower views, but I cannot give you an ETA for this yet. Cheers, Dave


#10

You can also experiment with adding the scroll interaction to the section before and have that interaction effect the element you want.

Scroll into view is used to set the initial appearance of the element and the scroll out of view is used to show the effect.

This avoids having to create duplicate content.

You can take a look at my website for an example.
alexandernichol.com

The "brief introduction" section sets the skills section to 0 opacity and a width of 2%. When the brief scrolls out of view the skill bars expand.

Because the scroll interaction is disabled the scroll into view interaction doesn't take effect and therefor the skill bars will be visible on mobile.


#11

oh oke, so all the other interactions work, just the scrolling ones. I am sorry I misunderstood. So I can try one of the other interactions to make up for it.

Thanks @cyberdave


#12

@Davidn I really like your site, can you share it, so I can see how u built it, on the interactions part. Cause your explanation is not clear enough for me. If you don't want to share ur site which I would understand, could u elaborate on your explanation.


#13

Have a look.

This preview has a few different things floating around in it. Hope it helps.

https://preview.webflow.com/preview/davidnichol?preview=278f98c57471bceee147dd180df4dfba


#14