Question

I've got this problem with my website, it works perfectly until i tried it on other devices such as iPod/iPad. Because the image (the one with elephants) wont show up or either shows up for 1/2 seconds and then simply disappears again. I've seen other threads about this and mostly it's the image size that's the problem but this image is only 321 kb and 1.1MB (retina screens),

Anyone might have an solution for this?

http://testing.laurensvandermaas.nl

thank you :)

Was it helpful?

Solution

You can try setting the image to display with background-image, which is both more semantically correct and recommended as a solution to the 'image is too large' problem here. Web page design these days is 50% trying to appease different browsers, so try both trickery and hack-ery to make things work. And test, test, test.

Unrelatedly, scrolling on your page is not working (Chromium 31). And if you're dev'ing in PHP, try to use PHP comments when blocking off unused code:

<?php /* echo; */ ?>

instead of

<!-- ?php echo; ?> -->

HTML comments get sent to every client, unnecessarily bloating your page and potentially giving a h4x0r a clue to your internals which would be better left out.

OTHER TIPS

try adding this to the <head></head> section

<meta name="viewport" content="width=device-width, initial-scale=1">
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top