Code: Alles auswählen
<script>
// CREDITS:
// Random Order Slideshow with Messages
// by Urs Dudli and Peter Gehrig
// Copyright (c) 2010 Peter Gehrig and Urs Dudli. All rights reserved.
// Permission given to use the script provided that this notice remains as is.
// Additional scripts can be found at http://www.fabulant.com
// IMPORTANT:
// If you add this script to a script-library or a script-archive
// you have to insert a a highly visible link to http://www.fabulant.com
// right into the webpage where the script will be displayed.
///////////////////////////////////////////////////////////////////////////
// CONFIGURATION STARTS HERE
///////////////////////////////////////////////////////////////////////////
// Replace the URLs of the slides and the corresponding messages.
// Please note that the URL and the correponding message are separated by "|".
// Watch how the "," and the " " are set!
// You may add as many slides as you like.
// IMPORTANT: Do not use the return-key to break the lines!!!
var slideshow=new Array("../slideshowmulti/sampleholiday01.jpg|Time to relax.","../slideshowmulti/sampleholiday02.jpg|Yes, that looks like holiday!","../slideshowmulti/sampleholiday03.jpg|Colorize your house.","../slideshowmulti/samplewomen01.jpg|I love my hat.","../slideshowmulti/samplewomen02.jpg|Who is stronger?","../slideshowmulti/samplewomen03.jpg|Women are beautiful.","../slideshowmulti/samplecarneval01.jpg|Hey, let\'s go to Rio.","../slideshowmulti/samplecarneval02.jpg|Is this Rio? I think not!","../slideshowmulti/samplecarneval03.jpg|It\'s rather the end of carneval")
// the font-family of the messages
var fntfamily="Verdana"
// the font-size of the messages (ranging from 1 to 6)
var fntsize=1
// the font-color of the messages
// instead of "yellow" you also could write "FFFF00"
var fntcolor="yellow"
// the background-color of the messages
// instead of "black" you also could write "000000"
var bgrndcolor="black"
// the width of the slides (pixels)
var imagewidth=238
// the height of the slides (pixels)
var imageheight=156
// the minimum interval between each slide (seconds)
var standstill=4
///////////////////////////////////////////////////////////////////////////
// CONFIGURATION ENDS HERE
///////////////////////////////////////////////////////////////////////////
// do not change the code below
var imgstop=0
var imgsleft=0
var mestop=imageheight
var mesleft=0
var firstslide=true
var starttime
var nowtime
var imgurl=new Array()
var message=new Array()
var imgurlandmessagearray=new Array()
var imgurlandmessage
var imgpreload=new Array()
var playertop=0
var playerleft=0
var i_imgs=0
var i_loop=0
var i_preloadloop=0
var i_transition=0
var timerrotate=false
var timercheck=false
var contentimg
var contentmes
var slideshowlength=slideshow.length
var topdivheight=imageheight+40
var ns6=document.getElementById&&!document.all?1:0
var standstill=standstill*1000
function init() {
firstslide=true
i_imgs=0
i_loop=0
i_preloadloop=randommaker(slideshowlength)
if (timerrotate) {
clearTimeout(timerrotate)
clearTimeout(timercheck)
}
imgurl=new Array
message=new Array
for (i=0;i<=slideshow.length-1;i++) {
imgurlandmessage=slideshow[i].split("|")
imgurl[i]=imgurlandmessage[0]
message[i]=imgurlandmessage[1]
}
if (document.all) {
imgs.innerHTML=""
mes.innerHTML=""
document.all.imgs.style.posTop=imgstop
document.all.imgs.style.posLeft=imgsleft
document.all.mes.style.posTop=mestop
document.all.mes.style.posLeft=mesleft
checkpreloadtime()
preloadimage()
checkifloaded()
}
if (ns6) {
document.getElementById('imgs').innerHTML=""
document.getElementById('mes').innerHTML=""
document.getElementById('imgs').style.top=imgstop
document.getElementById('imgs').style.left=imgsleft
document.getElementById('mes').style.top=mestop
document.getElementById('mes').style.left=mesleft
checkpreloadtime()
preloadimage()
checkifloaded()
}
if (document.layers) {
document.topdiv.document.imgs.document.write("")
document.topdiv.document.imgs.document.close()
document.topdiv.document.mes.document.write("")
document.topdiv.document.mes.document.close()
document.topdiv.document.imgs.top=imgstop
document.topdiv.document.imgs.left=imgsleft
document.topdiv.document.mes.top=mestop
document.topdiv.document.mes.left=mesleft
checkpreloadtime()
preloadimage()
checkifloaded()
}
}
function checkifloaded() {
if (imgpreload.complete) {
nowtime=new Date()
nowtime=nowtime.getTime()
nowtime=nowtime-starttime
var interval=standstill-nowtime
if (interval<=0 ) {
interval=1
}
if (firstslide) {
interval=1
firstslide=false
}
if (i_preloadloop==i_loop) {
interval=1
}
timerrotate=setTimeout("rotateimages()", interval)
}
else {
timercheck=setTimeout("checkifloaded()", 100)
}
}
function preloadimage() {
imgpreload=new Image()
imgpreload.src=imgurl[i_preloadloop]
}
function rotateimages() {
i_loop=i_preloadloop
i_preloadloop=randommaker()
checkpreloadtime()
preloadimage()
getcontent()
if (document.all) {
imgs.filters[i_transition].apply()
imgs.innerHTML=contentimg
imgs.filters[i_transition].play()
i_transition++
if (i_transition>21) {i_transition=0}
mes.innerHTML=contentmes
}
if (ns6) {
document.getElementById('imgs').innerHTML=contentimg
document.getElementById('mes').innerHTML=contentmes
}
if (document.layers) {
document.topdiv.document.imgs.document.write(contentimg)
document.topdiv.document.imgs.document.close()
document.topdiv.document.mes.document.write(contentmes)
document.topdiv.document.mes.document.close()
}
i_loop++
checkifloaded()
}
function randommaker() {
rand=Math.floor(slideshowlength*Math.random())
return rand
}
function getcontent() {
contentimg="<img src='"+imgurl[i_loop]+"'>"
contentmes="<table cellpadding=2 cellspacing=0 border=0 bgcolor="+bgrndcolor+" width="+imagewidth+"><tr><td><font size="+fntsize+" color="+fntcolor+" face="+fntfamily+">"+message[i_loop]+"</font></td></tr></table>"
}
if (document.all) {
document.write('<div id="topdiv" style="position:relative;width:'+imagewidth+'px;height:'+topdivheight+'px">')
document.write('<div id="mes" style="position:absolute;"> </div>')
document.write('<div id="imgs" style="position:absolute;filter: revealTrans(Transition=1, Duration=2) revealTrans(Transition=2, Duration=2) revealTrans(Transition=3, Duration=2) revealTrans(Transition=4, Duration=2) revealTrans(Transition=5, Duration=1) revealTrans(Transition=6, Duration=2) revealTrans(Transition=7, Duration=2) revealTrans(Transition=8, Duration=1) revealTrans(Transition=9, Duration=2) revealTrans(Transition=10, Duration=1) revealTrans(Transition=11, Duration=2) revealTrans(Transition=12, Duration=2) revealTrans(Transition=13, Duration=1) revealTrans(Transition=14, Duration=2) revealTrans(Transition=15, Duration=2) revealTrans(Transition=16 Duration=1) revealTrans(Transition=17, Duration=2) revealTrans(Transition=18, Duration=2) revealTrans(Transition=19, Duration=1) revealTrans(Transition=20, Duration=2) revealTrans(Transition=21, Duration=2) revealTrans(Transition=22, Duration=2)"> </div>')
document.write('</div>')
}
if (ns6) {
document.write('<div id="topdiv" style="position:relative;width:'+imagewidth+'px;height:'+topdivheight+'px">')
document.write('<div id="mes" style="position:absolute;"> </div>')
document.write('<div id="imgs" style="position:absolute;"> </div>')
document.write('</div>')
}
if (document.layers) {
document.write('<ilayer name="topdiv" width='+imagewidth+' height='+topdivheight+'>')
document.write('<layer name="mes"> </layer>')
document.write('<layer name="imgs"> </layer>')
document.write('</ilayer>')
}
function checkpreloadtime() {
starttime= new Date()
starttime=starttime.getTime()
}
function checktime() {
}
window.onresize=new Function("window.location.reload()");
window.onload=init
</script>