CODEWITHSUNDEEP
javascriptjquery
Doug Molineux
Doug Molineux

Reputation: 12431

Javascript changing source of an image

I have some javascript which runs a timer that animates something on the website.

It all works perfectly but I want to get an image to change when the animation is run, It uses jquery: 

if(options.auto && dir=="next" && !clicked)
{
    timeout = setTimeout(function(){
if (document.images['bullet1'].src == "img/bulletwhite.png")
{
        document.images['bullet1'].src = "img/bullet.png";
        document.images['bullet2'].src = "img/bulletwhite.png";
}
animate("next",false);
                    },diff*options.speed+options.pause);
                }

options.auto means that its automatically cycling, dir is the direction of the motion and clicked is whether or not the user clicked it.

Is there something wrong with my syntax here? I ran firebug with it, and it doesn't throw any errors, it simply won't work. Any advice would help!

I should mention that the src of bullet1 starts at bulletwhite.png and then I was hoping for it to change to bullet.png and have bullet2 change to bulletwhite.png.

Upvotes: 1

Views: 284

Answers (2)

mamoo
mamoo

Reputation: 8166

According to the code you've posted there's a strange semicolon on second line, but maybe it's just a typo.

Why don't you try a JQuery attr() call instead of using document.images array?

$('img[name="bullet1"]').attr('src', 'img/bullet.png');

Upvotes: 0

Jaroslav Záruba
Jaroslav Záruba

Reputation: 4874

document.images['bullet1'].src == "img/bulletwhite.png"

Are you sure this condition is ever met?

Usually the imageElement.src property holds absolute/resolved version of what is in the src attribute. (This also applies to href attribute/property.)

<img src="/images/img1.png">

...

document.images[0].src => "http://127.0.0.1/images/img1.png"

Upvotes: 1

Related Questions