madtag
01-30-2005, 03:59 PM
Script: DHTML Slide Show Script
URL: http://www.dynamicdrive.com/dynamicindex14/dhtmlslide.htm
Hi all,
First of all if what I'm trying to do is actually against some rule, please let me know and I'll stop at once.
I like this script but need a function to load any image from the array instead of just the next or the previous one.
I have a basic knowledge of Java Scripting and tried to modify the code myself but obviously my knowledge is not good enough. Now not even the first image is loading and the links are not working. Any help is much appreciated.
Regards,
Mark A. Tagliaferro
I added the code in bold to the head section:
<script type="text/javascript">
/***********************************************
* DHTML slideshow script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice must stay intact for legal use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/
var photos=new Array()
var photoslink=new Array()
var which=0
//define images. You can have as many as you want:
photos[0]="../../graphics/gig1/gig1_01.jpg"
photos[1]="../../graphics/gig1/gig1_02.jpg"
photos[2]="../../graphics/gig1/gig1_03.jpg"
//Specify whether images should be linked or not (1=linked)
var linkornot=0
//Set corresponding URLs for above images. Define ONLY if variable linkornot equals "1"
photoslink[0]=""
photoslink[1]=""
photoslink[2]=""
//do NOT edit pass this line
var preloadedimages=new Array()
for (i=0;i<photos.length;i++){
preloadedimages[i]=new Image()
preloadedimages[i].src=photos[i]
}
function applyeffect(){
if (document.all && photoslider.filters){
photoslider.filters.revealTrans.Transition=Math.floor(Math.random()*23)
photoslider.filters.revealTrans.stop()
photoslider.filters.revealTrans.apply()
}
}
function playeffect(){
if (document.all && photoslider.filters)
photoslider.filters.revealTrans.play()
}
function keeptrack(){
window.status="Image "+(which+1)+" of "+photos.length
}
function backward(){
if (which>0){
which--
applyeffect()
document.images.photoslider.src=photos[which]
playeffect()
keeptrack()
}
}
function chooser(var i){
which = i
applyeffect()
document.images.photoslider.src=photos[which]
playeffect()
keeptrack()
}
function forward(){
if (which<photos.length-1){
which++
applyeffect()
document.images.photoslider.src=photos[which]
playeffect()
keeptrack()
}
}
function transport(){
window.location=photoslink[which]
}
</script>
In the body section i changed the parts in bold to this:
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="100%" colspan="3" height="22"><center>
<script>
if (linkornot==1)
document.write('<a href="javascript:transport()">')
document.write('<img src="'+photos[0]+'" name="photoslider" style="filter:revealTrans(duration=2,transition=23)" border=0>')
if (linkornot==1)
document.write('</a>')
</script>
</center></td>
</tr>
<tr>
<td width="33%" height="21"><a href="#" onClick="chooser(0);return false">Slide 1</a></td>
<td width="33%" height="21"><a href="#" onClick="chooser(1);return false">Slide 2</a></td>
<td width="33%" height="21"><a href="#" onClick="chooser(2);return false">Slide 3</a></td>
</tr>
</table>
URL: http://www.dynamicdrive.com/dynamicindex14/dhtmlslide.htm
Hi all,
First of all if what I'm trying to do is actually against some rule, please let me know and I'll stop at once.
I like this script but need a function to load any image from the array instead of just the next or the previous one.
I have a basic knowledge of Java Scripting and tried to modify the code myself but obviously my knowledge is not good enough. Now not even the first image is loading and the links are not working. Any help is much appreciated.
Regards,
Mark A. Tagliaferro
I added the code in bold to the head section:
<script type="text/javascript">
/***********************************************
* DHTML slideshow script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice must stay intact for legal use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/
var photos=new Array()
var photoslink=new Array()
var which=0
//define images. You can have as many as you want:
photos[0]="../../graphics/gig1/gig1_01.jpg"
photos[1]="../../graphics/gig1/gig1_02.jpg"
photos[2]="../../graphics/gig1/gig1_03.jpg"
//Specify whether images should be linked or not (1=linked)
var linkornot=0
//Set corresponding URLs for above images. Define ONLY if variable linkornot equals "1"
photoslink[0]=""
photoslink[1]=""
photoslink[2]=""
//do NOT edit pass this line
var preloadedimages=new Array()
for (i=0;i<photos.length;i++){
preloadedimages[i]=new Image()
preloadedimages[i].src=photos[i]
}
function applyeffect(){
if (document.all && photoslider.filters){
photoslider.filters.revealTrans.Transition=Math.floor(Math.random()*23)
photoslider.filters.revealTrans.stop()
photoslider.filters.revealTrans.apply()
}
}
function playeffect(){
if (document.all && photoslider.filters)
photoslider.filters.revealTrans.play()
}
function keeptrack(){
window.status="Image "+(which+1)+" of "+photos.length
}
function backward(){
if (which>0){
which--
applyeffect()
document.images.photoslider.src=photos[which]
playeffect()
keeptrack()
}
}
function chooser(var i){
which = i
applyeffect()
document.images.photoslider.src=photos[which]
playeffect()
keeptrack()
}
function forward(){
if (which<photos.length-1){
which++
applyeffect()
document.images.photoslider.src=photos[which]
playeffect()
keeptrack()
}
}
function transport(){
window.location=photoslink[which]
}
</script>
In the body section i changed the parts in bold to this:
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="100%" colspan="3" height="22"><center>
<script>
if (linkornot==1)
document.write('<a href="javascript:transport()">')
document.write('<img src="'+photos[0]+'" name="photoslider" style="filter:revealTrans(duration=2,transition=23)" border=0>')
if (linkornot==1)
document.write('</a>')
</script>
</center></td>
</tr>
<tr>
<td width="33%" height="21"><a href="#" onClick="chooser(0);return false">Slide 1</a></td>
<td width="33%" height="21"><a href="#" onClick="chooser(1);return false">Slide 2</a></td>
<td width="33%" height="21"><a href="#" onClick="chooser(2);return false">Slide 3</a></td>
</tr>
</table>