2

i got a problem to set custom background into my jquerymobile android apps. The problem is after i add the panel into the page. basically i just using this css code below.

.ui-page { background-image: url(images/bg.jpg); -webkit-backface-visibility: hidden; }

to set my backround, but after i put the code below

<div data-role="page">

<div data-role="panel" id="mypanel">
<!-- panel content goes here -->
</div><!-- /panel -->

<!-- header -->
<!-- content -->
<!-- footer -->

The background is blank, can someone please help me.

2
  • Is this patch correct : url(images/bg.jpg);
    – Tugrul
    Jul 19, 2013 at 9:05
  • yes the path is correct @tgrll Jul 22, 2013 at 2:23

1 Answer 1

3

Use this:

.ui-page, .ui-content { 
    background-image: url(images/bg.jpg) !important; 
    -webkit-backface-visibility: hidden !important; 
}

When overriding default jquery mobile classes you must override it with !important. Without it jQuery Mobile will just use default values.

2
  • I already override it but still the background image is blank. @gajotres Jul 22, 2013 at 2:24
  • Then override .ui-content, it covers .ui-page
    – Gajotres
    Jul 22, 2013 at 7:24

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.