user381800
user381800

Reputation:

Change background image url

I am trying to change the background of the input button when clicked by using jquery but for the life of me, can't figure out the relative path to make it work.

js file is in root/js folder css file is in root/css folder

My code looks like this:

jQuery($button).css('background',"url(../images/updating_button.gif)");

But this just doesn't work...it can't find the image with that path. if I use absolute path it works obviously but i really need it to be relative.

I have tried all combination that I know like:
/images/updating_button.gif
..images/updating_button.gif
images/updating_button.gif
updating_button.gif

Upvotes: 2

Views: 5395

Answers (4)

user2496033
user2496033

Reputation:

The following code might be useful for you:

 jquery("button").css("background-image","url(menubar/ajax-loader.gif)");

Upvotes: 0

Kevin
Kevin

Reputation: 3841

If the URL is static, you could declare a class with the background and maintain your relative path.

In your CSS:

.updating { background: url(../images/updating_button.gif); }

In your JS:

jQuery($button).addClass('updating');

Upvotes: 3

jlmakes
jlmakes

Reputation: 2965

I wish I could test this for you, but I've had some issues with the url property in the past; adding single quotes inside the url() has proved to be the most reliable with relative paths.

jQuery($button).css('background',"url('../images/updating_button.gif')");

Also, what does your file structure look like?

Upvotes: 0

Matti Virkkunen
Matti Virkkunen

Reputation: 65126

You are aware that paths in any inline styles (whether set with JS or not) will be relative to the current HTML document (the URL on the browser's URL bar), not any other file, right?

And why are you avoiding absolute (or domain-relative) URLs?

Upvotes: 1

Related Questions