© iljilj@flowsim.se
- bildspel


 
start!
    white!
    black!
Tre ytor:
1 yta med bild(plats)
2 yta som täcker bilden
3 yta för text
 
1
<div id ="bildl"
style="position:absolute;width:120px;left:40px;top:80px;height:140px">
<IMG SRC="bild.jpg" WIDTH="120" HEIGHT="120" alt="">
</div>
 
2
<div id ="topp"
style="position:absolute;width:120px;height:140px;
background-color:#ffffff; border-bottom:1px black solid;
left:40px;top:60px;font-weight:bold;padding-left:6px">
</div>
 
3
<div id ="iljtxt2" style="position:absolute;width:160px;height:30px; background-color:#ffffff;left:180px;top:0px;color:#000000; font-weight:bold;letter-spacing:0.2em">
</div>
 
<script type="text/javascript">
startad=0
bildbyte=0
lhojd=120 //
iljdone=0
maxvarv=2
 
if(document.images && document.getElementById)
{
bild=new Array()
iljtext= new Array()
bild[0]=new Image()
bild[0].src="leaf.gif"
iljtext[0]='leaf'
bild[1]=new Image()
bild[1].src="feet.gif"
iljtext[1]='feet'
bild[2]=new Image()
bild[2].src="beetle.gif"
iljtext[2]='beetle'
bildbyte=1
// etc
}
 
function iljcheck()
{
if(startad==0 && bildbyte==1)
{
iljdone=0
bildnummer=0
document.images[0].src=bild[bildnummer].src
bildnummer=1
startad=1
iljshrink2()
}
}
function iljshrink2()
{
iljtimer=setTimeout("iljshrink2()",40)

if(parseInt(document.getElementById("topp").style.height)>20)
{
document.getElementById("topp").style.height= parseInt(document.getElementById("topp").style.height)-2+'px'
}
else
{
document.getElementById("topp").innerHTML=iljtxt[bildnummer-1]
if(bildnummer==bild.length && iljdone<maxvarv-1)
{
bildnummer=0
iljdone++

}
clearTimeout(iljtimer)
setTimeout("iljgrow()",1000)
}
}
function iljgrow()
{
if(bildnummer<bild.length)
{
document.getElementById("topp").innerHTML=''
iljtimer2=setTimeout("iljgrow()",20)
if(parseInt(document.getElementById("topp").style.height)<lhojd+20)
{
document.getElementById("topp").style.height= parseInt(document.getElementById("topp").style.height)+2+'px'
}
else
{
document.images[0].src=bild[bildnummer].src

bildnummer++
clearTimeout(iljtimer2)
setTimeout("iljshrink2()",700)
}
}
else{
startad=0
bildnummer=0
}
}
</script>
 
 
Startas t.ex.:
<body onload ="iljcheck()">
 

Sidan gjordes av
 
ilj
 
ilj@flowsim.se
 

 
Last modified: February 10, 1999

http://www.flowsim.se
JAVASCRiPT