T
tarnkappe
Hallo zusammen
Ich habe dieses Script auf einer Seite gefunden, es handelt sich um eine Slideshow.
Eine beliebige Anzahl von Bildern wird in einer Tabelle nacheinander geladen, ein Bild kommt das vorige geht.
Ich wollte das etwas abändern und zwar so das die Tabelle aus 1 Zeile und 5 Spalten besteht.
Das erste Bild was in jeder Spalte vorhanden ist beim öffnen der Seite ist ein Farbfeld welches die Farbe meines Seitenhintergrundes hat. Dann soll in die erste Spalte ein Bild "geslided" werden und dort bleiben.
Dann das zweite Bild in die zweite Spalte und dort bleiben und so weiter bis alle 5 Bilder geladen wurden.
Kann mir da jemand behilflich sein?
Mfg
tarnkappe
//Andreas: Lange Codestücke bitte in die dafür vorgesehenen Tags setzen
Ich habe dieses Script auf einer Seite gefunden, es handelt sich um eine Slideshow.
Eine beliebige Anzahl von Bildern wird in einer Tabelle nacheinander geladen, ein Bild kommt das vorige geht.
Ich wollte das etwas abändern und zwar so das die Tabelle aus 1 Zeile und 5 Spalten besteht.
Das erste Bild was in jeder Spalte vorhanden ist beim öffnen der Seite ist ein Farbfeld welches die Farbe meines Seitenhintergrundes hat. Dann soll in die erste Spalte ein Bild "geslided" werden und dort bleiben.
Dann das zweite Bild in die zweite Spalte und dort bleiben und so weiter bis alle 5 Bilder geladen wurden.
Kann mir da jemand behilflich sein?
Mfg
tarnkappe
//Andreas: Lange Codestücke bitte in die dafür vorgesehenen Tags setzen
HTML:
===========================================================
Script: JavaScript Cross-Browser SlideShow Script
With Cross-Fade Effect between Images
Adjustable Timing and Unlimited Images
Function: Displays images continuously in a slideshow
presentation format, with a fade effect on
image transitions.
Browsers: All common browsers: NS3-6, IE 4-6
Fade effect only in IE; others degrade gracefully
Author: etLux
===========================================================
Step 1.
Put the following script in the head of your page:
<script>
// (C) 2000 www.CodeLifter.com
// www.codelifter.com
// Free for all users, but leave in this header
// NS4-6,IE4-6
// Fade effect only in IE; degrades gracefully
// =======================================
// set the following variables
// =======================================
// Set slideShowSpeed (milliseconds)
var slideShowSpeed = 5000
// Duration of crossfade (seconds)
var crossFadeDuration = 3
// Specify the image files
var Pic = new Array() // don't touch this
// to add more images, just continue
// the pattern, adding to the array below
Pic[0] = '1.jpg'
Pic[1] = '2.jpg'
Pic[2] = '3.jpg'
Pic[3] = '4.jpg'
Pic[4] = '5.jpg'
// =======================================
// do not edit anything below this line
// =======================================
var t
var j = 0
var p = Pic.length
var preLoad = new Array()
for (i = 0; i < p; i++){
preLoad[i] = new Image()
preLoad[i].src = Pic[i]
}
function runSlideShow(){
if (document.all){
document.images.SlideShow.style.filter="blendTrans(duration=2)"
document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration)"
document.images.SlideShow.filters.blendTrans.Apply()
}
document.images.SlideShow.src = preLoad[j].src
if (document.all){
document.images.SlideShow.filters.blendTrans.Play()
}
j = j + 1
if (j > (p-1)) j=0
t = setTimeout('runSlideShow()', slideShowSpeed)
}
</script>
===========================================================
Step 2.
Put this onload event call in your body tag:
<body onload="runSlideShow()">
===========================================================
Step 3.
Put this in the body of your page where you want the
slide show to appear.
Set widths and heights same as images
Set image file same as first image in array Pic[] (above)
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td id="VU" height=150 width=150>
<img src="1.jpg" name='SlideShow' width=150 height=150></td>
</tr>
</table>
Zuletzt bearbeitet von einem Moderator: