2 simple questions 4 u anyway :)

I have a img element that looks like this:
<img id=“button” src=“images/playBtn.png” />

when I click on it it toggles a play/pause button. The button changes as it should but the slideshow doesn’t turn off when I click pause.

the code to handle the element:

var auto = document.getElementById("button");
// alert(auto.src);

	auto.onclick = function() {
 		if(auto.src == "file:///C:/jimslounge.com/jsClass/lab6.1/images/playBtn.png") {
 			auto.src="images/pauseBtn.png";
 			var showOn = window.setInterval("loadNextPic()", 5000);
 		}else{
 			auto.src="images/playBtn.png";
 			clearInterval(showOn);
 		}
 	}

I noticed when I did an alert on auto src it displays the full path. I want to only have to test for “images/playBtn.png”.
Another problem I have is in the else part the image changes like it should but the clearInterval(showOn); doesn’t seem to do anything I thought it would pause the slideshow.

The reason why your call to clearInterval isn’t doing anything is because you made showOn a local variable by declaring it with the var keyword in the first part of the if/else statement. Removing var should make it global, and therefore accessible to clearInterval in the else part. Either that or declare showOn outside of the onclick function.

As for testing auto.src, you could just check that it contains the string “images/playBtn.png” using the indexOf method of String, like this:


if (auto.src.indexOf("images/playBtn.png") > -1) {
// The current src contains "images/playBtn.png"
} else {
// The current src doesn't contain "images/playBtn.png"
}

thank you so much!