Skrollr does not work on mobile devices

so this seems to be a general question , however, none of the answers provided me any joy. I have fully read the Skrollr Documentation and can conclude that I am completely at a loss here.

My website

My basic html markup:

<html> <head> <!-- Head Stuff --> </head> <body> <div id="navbar"> <!-- This is a fixed position div --> </div> <div id="skrollr-body"> <!-- Rest of my site --> </div> <script src="skrollr.min.js"></script> <script> skrollr.init({ forceHeight: false }); </script> </body> </html> 

This way you can see how the documentation of my fixed element is outside of my other content.


I am using Version 0.6.26 (2014-06-08) - downloaded from GitHub .

Download zip

Mobile testing on iPad 2, iOS7 and Google Nexus 4, Android 4.4.4

Thanks in advance for any suggestions / help

+6
source share
2 answers

I just did not enter / set the height in the skrollr-body section. I fixed it by simply adding:

 #skrollr-body { float: left; width: 100%; height: 100%; } 
+1
source

In accordance with this (about halfway down in the mobile support section), for it to work on mobile devices, you need #skrollr-body on your page, which I did not see in your source.

Also, this github question seems to solve this problem.

0
source

Source: https://habr.com/ru/post/971956/


All Articles