Forum | Appery.io

Where do you place this code?

You now have only one selector -- "nav_contact".

I added this JS to page load:

$('a[dsid="nav_contact"]').css('background-image', 'url("'+Tiggzi.getImagePath('75-phone.png')+'")') ;

And this is my CSS:
[dsid=nav_contact] .ui-icon {
background: url("../../www/project/files/views/assets/image/75-phone.png");
background-repeat: no-repeat;
background-size: 24px 24px;
height: 24px !important;
margin-left: -10px !important;
width: 24px !important;
}

Hi Jennifer,

Everywhere, including your CSS code you should replace:

codehttp://appery.io/app/view/209b4ce6-485f-4129-8149-c43022e73c6b/code
with
code../../www/project/codeas I advised above.

Also, please note that onLoad event rewrites the style after you set it in CSS so you should choose between them and use an only option to set styles.

This is correct:
codebackground-repeat: no-repeat;/code

Yes, I realize that. I'm just trying to get one icon to work first.

Can you please log in and take a look? I've been going round and round on this for a while with no answer. The only way I can get the icon to load is to use the JS on page load. However, the icon is repeating. What can I add to the JS to get it to stop repeating?

JS on page load:
$('a[dsid="nav_contact"]').css('background-image', 'url("'+Tiggzi.getImagePath('75-phone.png')+'")') ;

The CSS does not work for me.

this is what I'm using:
[dsid=nav_contact] .ui-icon {
background: url("../../www/project/files/views/assets/image/75-phone.png");
background-repeat: no-repeat;
background-size: 24px 24px;
height: 24px !important;
margin-left: -10px !important;
width: 24px !important;
}

The image doesn't load in the builder or on a real device. I've tried.

Hi Jennifer,

To make the icons work in xCode you should change styles to:
codebackground: url("../image/Home-icon.png");/codeetc.

Then delete adding the image on Page Load event please.