Okay so I have a slideshow that also has links to allow the user to pick which slide they want to go to. That works okay for the most part, but once the user has selected a slide the slideshow continues to run, which I want to happen, but it continues to the next slide from when the loop function ran initially instead of the next slide in the show from the current slide. I tried recalling the function from the link function, but that really didn't do anything. I realize...at least I think that I realize that the function needs to be rerun from the new value of the count variable, but everything that I've tried to make it do that has been a colossal fail.
Again I'm a novice here and this has to be written in plain javascript, otherwise I'd have gotten this done via jquery in probably 3 lines of code.
Here's what my code is looking like right now:
<script type="text/javascript">
<!--
//preload images
var image1=new Image()
image1.src="assets/ww.jpg"
var image3=new Image()
image3.src="assets/discussion.gif"
var image2=new Image()
image2.src="assets/officeSpaceSmall.jpg"
var image4=new Image()
image4.src="assets/projects.jpg"
//create image array
var tt= new Array("assets/ww.jpg","assets/discussion.gif","assets/officeSpaceSmall.jpg","assets/projects.jpg");
var imgsrc=0;
var whichimg=0;
function moveit(){
document['pic'].src=tt[imgsrc];
whichimg=imgsrc
if (imgsrc<3)
++imgsrc
else
imgsrc=0
//call function every 7 seconds
setTimeout('moveit()',7000)
}
function changeit(imgname,imgsrc){
document[imgname].src=eval('tt['+imgsrc+']');
}
function over(){
switch (whichimg){
case 0:
window.location="http://mypath.westwood.edu/webapps/portal/frameset.jsp?tab_tab_group_id=_3_1&url=%2Fwebapps%2Fblackboard%2Fexecute%2FcourseMain%3Fcourse_id%3D _8450_1";
break;
case 1:
window.open("http://learn.westwood.edu/p61378189/","Tutorial");
break;
case 2:
window.alert("this is the date and time of this thing");
break;
case 3:
window.alert('do not procrastinate on projects and you might get good grades');
break;
default:
window.location="http://mypath.westwood.edu/webapps/portal/frameset.jsp?tab_tab_group_id=_3_1&url=%2Fwebapps%2Fblackboard%2Fexecute%2FcourseMain%3Fcourse_id%3D _8450_1";
}
}
//-->
</script>
function moveit(){
document['pic'].src=tt[imgsrc];
whichimg=imgsrc
if (imgsrc<3)
++imgsrc
else
imgsrc=0
//call function every 7 seconds
timerID=setTimeout(moveit, 7000)
}
function changeit(imgname,imgsrc){
clearTimeout(timerID);
document[imgname].src=tt[imgsrc];
whichimg=imgsrc;
moveit();
}
Again I'm a novice here and this has to be written in plain javascript, otherwise I'd have gotten this done via jquery in probably 3 lines of code.
That would be 6883 lines of library code and 3 line from you!
At least 98% of internet users' DNA is identical to that of chimpanzees
To really get this to work flawlessly DO NOT, I repeat DO NOT use your image index variable directly for your loop, because when you do, it appears to reset, or alter the src that the index points to. So I changed the variable on my counter function and then POINTED that to the index for reference.
so here's what my final code looks like
<script type="text/javascript">
<!--
//create image array
var tt= new Array("assets/tutoring.gif","assets/discussions.gif","assets/workshops.gif","assets/projects.gif");
var imgsrc=0;
var whichimg=0;
var count=0;
var tab=0;
//preload images
var preload = new Array();
for(n=0; n<tt.length; n++)
{ preload[n]=new Image();
preload[n].src=tt[n];
}
//function to auto scroll the slideshow
function moveit(){
//if browser does not support the image object, exit.
if (!document.images)
return
document['pic'].src=tt[count];
whichimg=count;
if (count<(tt.length-1))
count++
else
count=0
//call function every 7 seconds
timerID=setTimeout('moveit()', 7000);
}
//function to move to a specific slide
function changeit(imgname,imgsrc){
clearTimeout(timerID);
document[imgname].src=tt[imgsrc];
count=imgsrc;
moveit();
}
//function to control where the slides link
function over(){
switch (whichimg){
case 0:
window.location="this_place.html";
break;
case 1:
window.open("this_place.html","Tutorial");
break;
case 2:
window.alert("this is the date and time of this thing");
break;
case 3:
window.alert('do not procrastinate on projects and you might get good grades');
break;
default:
window.location="this_place.html";
}
}
//-->
</script>
Bookmarks