css background image not showing with ibm worklight

Question

I am trying to use a background image in my Worklight project. Everything works fine when i tried to run my code without worklight (I'm using notepad++ and run it on my browser).

However, my background image suddenly disappear when I use Worklight (i mean i copy - paste the code and edit the references), but other image (which use the src tag) is still there.

This is my css code:

body{
    background:url(../images/background.png) no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

This is the screenshot :

enter image description here

What does "before" mean? What does "moving code to the worklight environment" mean? How did you move it? where to did you move it? What is in your images folder? How does the HTML look like? Edit the question with this information. — Idan Adar, Jun 19 '13 at 07:43
@IdanAdar sorry for confusing you. Please see my edited question. Thanks — Blaze Tama, Jun 19 '13 at 07:46
@IdanAdar please see my other question about multiple pages.. http://stackoverflow.com/questions/17185260/ibm-worklight-click-a-button-to-go-to-another-page-multiple-page-application Thanks a lot :D — Blaze Tama, Jun 19 '13 at 07:47

score 2 · Accepted Answer · answered Jun 19 '13 at 08:01

2

By following the next steps, I saw my background image in the application:

Created a new Worklight project and application
Placed an image file in the images folder (myProjects\apps\myApp\common\images)
In the CSS file:

body { background:url("../images/background.jpg"); }
Build all and deploy
Previewed via Worklight Console

Like I mentioned in my comment - edit your question and add your HTML and CSS.
Also make sure you have placed the image in the images folder.

answered Jun 19 '13 at 08:01

Idan Adar

44,156
13
50
89

Sorry its still not working, please see my edited question (with screenshot). Thanks :D – Blaze Tama Jun 19 '13 at 08:12
It's working fine for me - try with a new application and see if only THAT works, then start making changes and check when it fails. – Idan Adar Jun 19 '13 at 08:27
Yes, its working perfectly with your way and center center fixed css. Thanks a lot :D – Blaze Tama Jun 22 '13 at 10:18

score 1 · Answer 2 · answered Jun 19 '13 at 07:47

1

Check the image url path. or add the image to the worklight project folder and check.

answered Jun 19 '13 at 07:47

Thanks for your help. I have checked all of it, and all of them is fine – Blaze Tama Jun 19 '13 at 07:48
1

Add quotes to that url. background:url("../images/background.png") no-repeat; – Jun 19 '13 at 07:55

css background image not showing with ibm worklight

2 Answers2