How to use a background image in the app header

[Gail]

Hi, I'd like to use an image instead of text as the header in my app's screens.

I have created a class called headerbg on the mobileheader element for a screen.

I have uploaded my image to the assets.

I have created the following custom css class:

.headerbg {
background-image: url(header.jpg);
background-repeat: no-repeat;
background-attachment: fixed;
background-position: 0px 0px;

}

1. Is there a place inside the app where I can store my global custom css code, or do I have to link to an external css file via in the External Resources section?

2. What is the url path I would use to reference my background-image that has been uploaded to my assets?

[maxkatz]

Hi Gail -

I'd say the easiest way right now is to add this custom CSS class via jQuery, for example on page load.

As for getting the image URL - drop the image on the page, test the page in browser and get its URL from source. Right now images are converted to assets and have a name in the form of: asset-xxxxx. This is going to be changed, we are going to keep the same name as the uploaded file name.