Question

-4

Changing image src onClick with jQuery

rated 0 times [ 1] [ 5] / answers: 1 / hits: 25957 / 12 Years ago, sat, december 15, 2012, 12:00:00

I am using this HTML on my site:
<a href=#1 id=slick-toggle><img src=img1.jpg/></a>

When I click this link, I would like to change the image src to img2.jpg. And revert back to img1.jpg when clicked again & so on. Can someone explain how I do this using jQuery?

Here is my existing jQuery if this helps:

$(document).ready(function() {     

  $('#slick-toggle').click(function() {

    $('#slickbox').toggle(400);

    return false;

  });

});

Many thanks for any pointers with this :-)

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

anayaashleyh

Add To Favorites

Follow

Total Points: 597

Total Questions: 96

Total Answers: 86

Location: Papua New Guinea

Member since Thu, Jul 9, 2020

4 Years ago

answered 12 Years ago agustindejonm · Accepted Answer

$(document).ready(function() {     

  $('#slick-toggle').click(function() {

    $('img', this).attr('src', function(i, oldSrc) {

        return oldSrc == 'img1.jpg' ? 'img2.jpg' : 'img1.jpg';

    });

    $('#slickbox').toggle(400);

    return false;

  });

});