search

oblador / angular-parallax

Lightweight & performant parallax scrolling for angular.js.
http://oblador.github.io/angular-parallax/
MIT License
203 stars 44 forks source link

Not working on mobiles #3

Closed cwhite92 closed 10 years ago

cwhite92 commented 10 years ago

Tested under Chrome 32.0.1700.99 on Android 4.4.2 and also under Safari on iOS7 (sorry, don't know how to get the Safari version number).

The parallax effect doesn't seem to work under these browsers and OSes. It's as if the plugin just isn't loaded, as the images that are meant to be parallax are behaving as if they're just plonked into the markup.

The implementation is correct as everything is perfect on desktops.

The problem can be recreated on the example page for this repo: http://durated.github.io/angular-parallax/

Here's the markup I'm using:

<img src="/img/faded-houses.png" alt="Faded houses" du-parallax y="slow" style="margin-right: -400px" />
<img src="/img/bill-stack.png" alt="Stack of bills" du-parallax y="medium" style="margin-left: 120px" />
fisshy commented 10 years ago

Scrolling on mobile blocks animations and executions of javascript.

This script is not made for mobile, what we did was to create a mobileversion web that was less interactive

oblador commented 10 years ago

What @fisshy said. Current scope does not include touch devices since they don't properly trigger the scroll event (only triggered once scrolling is ended). Performance is also not as great as on desktop so in our view giving touch devices (and older browsers) the fallback instead of sluggish parallax is the best approach.

However there are other solutions that use touch events instead of the scroll event that you could have a look at.

cwhite92 commented 10 years ago

Ah, fair enough. Thanks guys. Nice plugin regardless! :+1: