Wednesday, August 26, 2009

Toggle and Compare Images Using Javascript

If you are looking to change an image when a user clicks on it, you can try this function. I compare the image to check what image the user is seeing right now. In this example, my image path is: /Diamond/resources/ImageName.gif.

When the user clicks on an image, the system will pass in the number of the image.

I want the image to toggle between images after the user selects on it. Therefore, I split the image based on the forward slash to compare which image the user is on right now. This method will toggle between a blank star and a full star.

function AddOneFavorite(itemnumber)
{
var items=document.getElementById("oneimage" itemnumber).getAttribute("src").split("/");


if(items[items.length-1]=="star_small_blank.gif")
{
document.getElementById("oneimage" itemnumber).setAttribute("src","resources/images/star_small_full.gif")
}
else
{
document.getElementById("oneimage" itemnumber).setAttribute("src","resources/images/star_small_blank.gif")
}
}//end function

1 comments:

Litéra August 25, 2010 11:27 PM  

I will try this logic.Get back u again.


Thanks
Document Comparison