PDA

View Full Version : Swiss Army Slide Show - back button



sublime
07-30-2007, 08:33 PM
1) Script Title: Swiss Army Image Slide Show

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex14/swissarmy/index.htm

3) Describe problem: Excellent script! I am attempting to override the settings for the back and forward buttons so they can be used while the slide show is running.

In its original form the script disables the forward and back buttons when the slideshow is running. I've managed to over-ride the functionality on the forward button and it works as intended, but I need to know if there is a way to override the back button so that it will go back one slide, refresh the timer and then continue running forward.

Here are my replacement buttons and the js functions they are currently calling:

<div style="position:relative; top:-750px; left:-42px;">
<a href="javascript: iss[0].changeimg(false, 'nav'); iss[1].changeimg(false, ''nav')" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('back','','BackButton-rollover.png',1)">
<img src="BackButton.png" name="back" border="0" id="back" alt="" /></a>
<a href="javascript:iss[0].gostop(this); iss[1].gostop(this);" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('pause','','PauseButton-rollover.png',1)" onclick="document.getElementById('play').style.display= ''; document.getElementById('pause').style.display= 'none';">
<img src="PauseButton.png" name="pause" border="0" id="pause" style="display:inline;" alt="" /></a>
<a href="javascript:iss[0].gostop(this); iss[1].gostop(this);" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('play','','PlayButton-rollover.png',1)" onclick="document.getElementById('play').style.display= 'none'; document.getElementById('pause').style.display= '';">
<img src="PlayButton.png" name="play" border="0" id="play" style="display:none;" alt="" /></a>
<a href="javascript:iss[0].changeimg(true, 'nav'); iss[1].changeimg(true, 'nav');" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('forward','','ForwardButton-rollover.png',1)">
<img src="ForwardButton.png" name="forward" border="0" id="forward" alt="" /></a></div>

Help would be much appreciated. TIA

======================================================================================

As is true to form. As soon as I give up and finally ask for help, I find a solution on my own. For those who may be interested:


inter_slide.prototype.changebk=function(bool,nav){
this.buttons(false)
this.nextimgidx=(this.imgs.length-1)? this.keeptrack()-1 : 0
if(this.nextimgidx<0)
this.nextimgidx=this.imgs.length-1
this.populateslide(this.tempobj, this.nextimgidx)
if(bool)
this.rotateimg()
clearTimeout(this.inprocess)
this.inprocess=setTimeout("iss["+this.issid+"].rotateimg()", this.delay)
}

then the buttons with the js call:


<div style="position:relative; top:-750px; left:-42px;"> <a href="javascript: iss[0].changebk(true, 'nav'); iss[1].changebk(true, 'nav')" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('back','','scriptaculous/BackButton-rollover.png',1)"><img src="scriptaculous/BackButton.png" name="back" border="0" id="back" alt="" /></a><a href="javascript:iss[0].gostop(this); iss[1].gostop(this);" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('pause','','scriptaculous/PauseButton-rollover.png',1)" onclick="document.getElementById('play').style.display= ''; document.getElementById('pause').style.display= 'none';"><img src="scriptaculous/PauseButton.png" name="pause" border="0" id="pause" style="display:inline;" alt="" /></a><a href="javascript:iss[0].gostop(this); iss[1].gostop(this);" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('play','','scriptaculous/PlayButton-rollover.png',1)" onclick="document.getElementById('play').style.display= 'none'; document.getElementById('pause').style.display= '';"><img src="scriptaculous/PlayButton.png" name="play" border="0" id="play" style="display:none;" alt="" /></a><a href="javascript:iss[0].changeimg(true, 'nav'); iss[1].changeimg(true, 'nav');" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('forward','','scriptaculous/ForwardButton-rollover.png',1)"><img src="scriptaculous/ForwardButton.png" name="forward" border="0" id="forward" alt="" /></a></div>

This solution doesn't necessarily support all of the fancy functions of this slide show... but if you need a back button like I did, now you have it.