jQuery Mobile background image not showing on a full screen iPad web app

jquery-mobile, mobile-website, web-applications

Solution

In the end this is what worked for me.

<div data-role="page" id="home" style="background: #000000 
    url('img/background.jpg') repeat;">

wouldn't work via a css file.

Problem

I have set a background on the data-role="page" element like so ``` <div data-role="page" style="background: transparent url('img/background.jpg') no-repeat;" > ``` It works perfectly fine on a desktop browser and on the iPad safari browser. The issue I am having is that when you add the website to the home screen as an 'app' and it is a full screen web app. It doesn't show the background... I have tried setting it via a style sheet and inline and both ways give me the same issue. I am completely out of ideas as to why this wouldn't work. Any ideas are greatly appreciated.

Original source

Related problems