so...
ive created a random slide show of 3 panels side by side, all of them with a random time intervals between each slide. it all works great.
im now looking to create a user controlled start/stop option for EACH panel, based on an onclick over each image - and thats where Im having difficulty. can anyone help me out? much appreciated...

//THIS PART WORKS FINE:
function allPlantPick(plantId)
      {
          setTimeout(
                    function()
                    {
                        plantPick(plantId);
                        allPlantPick(plantId);
                    },
                    plantTimer()
                );
      }
      for(var i = 1; i < 4; ++i)
      {
          allPlantPick('plant' + i);
      }

/*function allPlantPick(){
	alert (plantTimer());
	setInterval("plantPick('plant1')", plantTimer());
	setInterval("plantPick('plant2')", 1000);
	setInterval("plantPick('plant3')", 1000);
	
}*/
	
function plantTimer() {

	var plantNum = (Math.random()*500) + 1000;
	return(plantNum);
	
}
		
function plantPick(myFoo){

 var plantChoices=["images/p1.jpg","images/p2.jpg","images/p3.jpg","images/p4.jpg","images/p5.jpg","images/p6.jpg","images/p7.jpg"];
 
 document.getElementById(myFoo).style.backgroundImage = "url(" + plantChoices[ Math.floor(Math.random()*plantChoices.length) ] + ")";
}

//THIS PART DOESNT WORK SO WELL:

var q = 1;

function pStopGo() {
	
	if (q == 1) {
		stopPlant();
		q = 2;
	}
	else if (q == 2) {
		goPlant();
		q = 1;
	}

function stopPlant(){
	window.clearTimeout(startStop);
}

function goPlant(){
	allPlantPick();
}

}

Not sure how the code is going but I don't see startStop being instantiated.

If you have something like:

startStop = setTimeout(function() {}, 1000);

Then you can stop it using:

clearTimeout(startStop);

or clearInterval() I believe for setInterval().

This article has been dead for over six months. Start a new discussion instead.