prostang
asked on
javascript function to stop show
I modified some code I found to display a slide show and have it working exactly as I want. I have run into a problem where I cannot stop the show and clear the canvas. Here is the code to run the slideshow:
Here is the function that I wrote thinking that it would stop the slideshow:
// JavaScript Document
var imagePaths = [
"_sites/BBB_homepage.png",
"_sites/CabezonKidsDental_homepage.png",
"_sites/djer_homepage.png",
"_sites/enchanted_homepage.png",
"_sites/JoeSSausage_homepage.png",
"_sites/MMCS_homepage.png",
"_sites/mySRB.png",
"_sites/PHCP_homepage.png",
"_sites/smilesforkidsnm_homepage.png",
"_sites/t2consulting_homepage.png",
"_sites/Upward_homepage.png",
"_sites/Webb_based_homepage.png"
];
var showCanvas = null;
var showCanvasCtx = null;
var img = document.createElement("img");
var currentImage = 0;
var revealTimer;
var stopShow = 0;
function slideShow() {
if (!stopShow){
showCanvas = document.getElementById('Canvas1');
showCanvasCtx = showCanvas.getContext('2d');
//clear canvas
showCanvasCtx.clearRect(0,0,showCanvasCtx.canvas.width,showCanvasCtx.canvas.height);
img.setAttribute('width','500');
img.setAttribute('height','400');
switchImage();
//start the animation
setInterval(switchImage,3000);
}
}
function switchImage() {
img.setAttribute('src',imagePaths[currentImage++]);
if (currentImage >= imagePaths.length)
currentImage = 0;
showCanvasCtx.globalAlpha = 0.1;
revealTimer = setInterval(revealImage,100);
}
function revealImage() {
showCanvasCtx.save();
showCanvasCtx.drawImage(img,100,0,500,400);
showCanvasCtx.globalAlpha += 0.1;
if (showCanvasCtx.globalAlpha >= 1.0) clearInterval(revealTimer);
showCanvasCtx.restore();
}
Here is the function that I wrote thinking that it would stop the slideshow:
function stopSlideShow() {
//alert('stop show');
clearInterval(revealTimer);
stopShow=1;
}
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
it stops the function, but does not allow to clear the canvas and the information under the image still has an alpha of .1.
http://mjmco.com/MJMCo.html
the web design link will show -view examples when clicked.
the -view examples runs the slide show, the stop (just for testing now) should (and does stop it).
When I click any other link, the first command is to clear the canvas, which isn't working now.
http://mjmco.com/MJMCo.html
the web design link will show -view examples when clicked.
the -view examples runs the slide show, the stop (just for testing now) should (and does stop it).
When I click any other link, the first command is to clear the canvas, which isn't working now.
ASKER