Code: Alles auswählen
<script>
// CREDITS:
// Joy of JavaScript: Floating Images Animation
// By 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 script-archive
// you have to add a highly visible link to
// http://www.fabulant.com on the webpage
// where this script will be featured
// The images (URLS). Add as many pictures as you like
var slideurl=new Array("pic1.jpg", "pic2.jpg", "pic3.jpg", "pic4.jpg")
// The comments for each image
var slidecomment=new Array("Tina", "Beth", "Maureen", "Wilma")
// The links, corresponding to the images above. Set "#" if your images should be NOT linked.
var slidelink=new Array("http://www.fabulant.com","http://www.fabulant.com","http://www.fabulant.com","#")
// The targets, corresponding to the links above
var slidetarget=new Array("_blank","_blank","_blank","_blank")
// Font of comment
var slidefont="Arial"
// Color of font
var slidefontcolor="black"
// Size of font (accepted values: 1 - 6)
var slidefontsize="1"
// Do not edit below this line
var ns4=document.layers?1:0
var ns6=document.getElementById&&!document.all?1:0
var ie=document.all?1:0
var floatingspeed=10
var tempo=20
var numberofimages=slideurl.length-1
var stepx=new Array()
var stepy=new Array()
for (i=0;i<=numberofimages;i++) {
stepx[i]=randommaker(floatingspeed)
stepy[i]=randommaker(floatingspeed)
}
var imgwidth=new Array()
var imgheight=new Array()
for (i=0;i<=numberofimages;i++) {
imgwidth[i]=10
imgheight[i]=10
}
var x,y
var marginbottom
var marginleft=0
var margintop=0
var marginright
var timer
var i_fadestrength=new Array()
var i_fadestep=new Array()
var i_fadenow=new Array()
var i_fadenowmax=new Array()
for (i=0;i<=slideurl.length;i++) {
i_fadenowmax[i]=randommaker(10)+2
i_fadestrength[i]=randommaker(99)
i_fadestep[i]=1
i_fadenow[i]=0
}
var spancontent=new Array()
var imgpreload=new Array()
for (i=0;i<=slideurl.length;i++) {
imgpreload[i]=new Image()
imgpreload[i].src=slideurl[i]
}
for (i=0;i<=numberofimages;i++) {
spancontent[i]="<a href='"+slidelink[i]+"' target='"+slidetarget[i]+"'><img src='"+slideurl[i]+"' border='0'></a><br><font face='"+slidefont+"' color='"+slidefontcolor+"' size='"+slidefontsize+"'>"+slidecomment[i]+"</font>"
}
function setValues() {
if (ie) {
marginbottom=document.body.clientHeight-5
marginright=document.body.clientWidth-5
for (i=0;i<=numberofimages;i++) {
var thisspan = eval("document.all.span"+i)
thisspan.innerHTML=spancontent[i]
imgwidth[i]=thisspan.offsetWidth
imgheight[i]=thisspan.offsetHeight
var maxleftstart=marginright-imgwidth[i]
var maxtopstart=marginbottom-imgheight[i]
var thisspan = eval("document.all.span"+(i)+".style")
thisspan.visibility="visible"
thisspan.posLeft=randommaker(maxleftstart)
thisspan.posTop=randommaker(maxtopstart)
}
checkmovement()
}
if (ns6) {
marginbottom=window.innerHeight-11
marginright=window.innerWidth-11
for (i=0;i<=numberofimages;i++) {
var thisspan=document.getElementById('span'+i)
thisspan.innerHTML=spancontent[i]
var thisspan=document.getElementById('span'+i)
imgwidth[i]=parseInt(thisspan.offsetWidth)
imgheight[i]=parseInt(thisspan.offsetHeight)
var maxleftstart=marginright-imgwidth[i]
var maxtopstart=marginbottom-imgheight[i]
var thisspan=document.getElementById('span'+i).style
thisspan.left=parseInt(thisspan.left)+randommaker(maxleftstart)
thisspan.top=parseInt(thisspan.top)+randommaker(maxtopstart)
thisspan.visibility="visible"
}
checkmovement()
}
}
function randommaker(range) {
rand=Math.floor(range*Math.random())
if (rand==0) {rand=Math.ceil(range/2)}
return rand
}
function checkmovement() {
checkposition()
movepictures()
timer=setTimeout("checkmovement()",tempo)
}
function movepictures() {
if (ie) {
for (i=0;i<=numberofimages;i++) {
var thisspan=eval("document.all.span"+(i)+".style")
thisspan.posLeft+=stepx[i]
thisspan.posTop+=stepy[i]
var thisfilter=eval("span"+i)
i_fadenow[i]++
if (i_fadenow[i]>=i_fadenowmax[i]) {
i_fadenow[i]=0
if (i_fadestrength[i]>=100) {i_fadestep[i]=i_fadestep[i]*-1}
else if (i_fadestrength[i]<=-20) {i_fadestep[i]=i_fadestep[i]*-1}
}
i_fadestrength[i]+=i_fadestep[i]
thisfilter.filters.alpha.opacity=Math.round(i_fadestrength[i])
}
}
if (ns6) {
for (i=0;i<=numberofimages;i++) {
var thisspan=document.getElementById('span'+i).style
thisspan.left=parseInt(thisspan.left)+stepx[i]
thisspan.top=parseInt(thisspan.top)+stepy[i]
i_fadenow[i]++
if (i_fadenow[i]>=i_fadenowmax[i]) {
i_fadenow[i]=0
if (i_fadestrength[i]>=100) {i_fadestep[i]=i_fadestep[i]*-1}
else if (i_fadestrength[i]<=-20) {i_fadestep[i]=i_fadestep[i]*-1}
}
i_fadestrength[i]+=i_fadestep[i]
document.getElementById('span'+i).style.opacity=Math.round(i_fadestrength[i])/100
}
}
}
function checkposition() {
if (ie) {
for (i=0;i<=numberofimages;i++) {
var thisspan=eval("document.all.span"+i+".style")
if (thisspan.posLeft>marginright-imgwidth[i]-floatingspeed) {
thisspan.posLeft-=Math.abs(stepx[i]+1)
stepx[i]=randommaker(floatingspeed)*-1
}
if (thisspan.posLeft<marginleft) {
thisspan.posLeft+=Math.abs(stepx[i])
stepx[i]=randommaker(floatingspeed)
}
if (thisspan.posTop>marginbottom-imgheight[i]-floatingspeed) {
thisspan.posTop-=Math.abs(stepy[i])
stepy[i]=randommaker(floatingspeed)*-1
}
if (thisspan.posTop<margintop) {
thisspan.posTop+=Math.abs(stepy[i])
stepy[i]=randommaker(floatingspeed)
}
}
}
if (ns6) {
for (i=0;i<=numberofimages;i++) {
imgwidth[i]=parseInt(document.getElementById('span'+i).offsetWidth)
imgheight[i]=parseInt(document.getElementById('span'+i).offsetHeight)
var thisspan=document.getElementById('span'+i).style
var leftx=parseInt(thisspan.left)
var topy=parseInt(thisspan.top)
if (leftx>marginright-imgwidth[i]-floatingspeed) {
thisspan.left=leftx-Math.abs(stepx[i]+1)
stepx[i]=randommaker(floatingspeed)*-1
}
if (leftx<marginleft) {
thisspan.left=leftx+Math.abs(stepx[i])
stepx[i]=randommaker(floatingspeed)
}
if (topy>marginbottom-imgheight[i]-floatingspeed) {
thisspan.top=topy-Math.abs(stepy[i])
stepy[i]=randommaker(floatingspeed)*-1
}
if (topy<margintop) {
thisspan.top=topy+Math.abs(stepy[i])
stepy[i]=randommaker(floatingspeed)
}
}
}
}
if (ie || ns6) {
for (i=0;i<=numberofimages;i++) {
document.write("<span id='span"+i+"' style='position:absolute;top:0px;left:0px;filter:alpha(opacity=0);opacity:0';visibility:hidden></span>")
document.close()
}
window.onload=setValues
}
</script>
<div id="emptydiv" style="position:absolute;top:0px;left:0px;visibility:hidden">Do not delete</div>