jQuery Skrollr images not showing on tablet

For a website I am working on for the index page I try to use Skrollr (paralax) as you can see here

On my laptop and desktop it is working as expected, but on my tablet I just get a black background. The images are are only showing for a second when the page is opening.

Seems to work on my iphone except that when the fixed menu kicks in it is much too big for mobile.

Hi Paul. Thanks for the reaction. I not even tested it on mobilel :frowning: I just did as well (Sony experia) and indeed it was/is working and indeed the fixed header is way to big, but that can be worked on :slight_smile: Leaves me with the tablet I even uoloaded the complete skrollr examples, because I thought there was maybe an error in my mark up but with that example it doesnt show the images either on the tablet

Example

One thing I forgot to mention in the opening post is that the first picture is vissible for a split of a second before the background turns black

I tested on the ipad and it seems ok there also. I can oly guess that your fixed header is appearing straight away on your tablet for some reason and covering the image.

Hi Paul. Thanks again for the reply. I have created a few media queries to see if the header was indeed the header that was causing the problem but I still don’t see any images. I still get a black background. I have really no idea what the reason can be and on the github I don’t get any answer either. Is there something you can think off?

What tablet are you using?

Is it an old one that doesn’t support css3?

Can you get a screenshot?

In the end it may be that you will have to create a reduced test case for this tablet to see if it can handle what you need. A lot of old (and not so old) tablets and phones do not support fixed positioning so you may need to perhaps create media queries and supply an alternative view for smaller screens.

Hi Paul it’s a Samsung Tab 2 10.1. Here are two screenshots:

Which version of android are you running as earlier versions don’t support fixed positioning.

Its one of those things that we can’t debug without having the same device as you. I would suggest that you you try and make a simplified version of the site and then see if it works in the base version. It could take a while to find the cause or you might just stumble on to the answer straight away.

Try disabling js and see if that makes a difference initially.

Alternatively delete one section at a time and re-test and see if the problem is still there each time. It’s likely to be a matter of trial and error.

I would expect complex parallax sites like that not to work on mobile or tablets very well anyway.

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.