Amazon If you use jQuery image lazy load plugin at http://www.appelsiini.net/projects/lazyload on your website you may find that the lazy load function breaks on smartphones. Or image lazy load may be quirky and flaky on mobile devices.
I use this plugin on my website http://www.mensfashionforless.com/ and everything works fine on my PC. One day I navigated to my site on my iPhone 4 and to my surprise the image lazy load function does not work completely. Sometimes a few of the images are successfully loaded; other times none of the images are loaded despite multiple scrolling attempts.
So what's going on?
I have the following meta tag in my HTML.
<meta name="viewport" content="width=device-width">
I realized that this line is responsible for the lazy load plugin failing. As soon as I remove this line the image lazy loading works again. I feel bad about having to remove this line because my website is displayed better with this line in the HTML on iPhone and iPad.
If you have any insight into why this happens feel free to chime in below.
Questions? Let me know!