You big dummy. You don't have a clue to what you are doing. Why don't I just write it for you.
HTML Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD><TITLE>FirefoxFade</TITLE>
<META http-equiv=Content-Type content="text/html; charset=UTF-8">
<STYLE type=text/CSS>
* {margin:0; padding:0;}
.thum{height:40px;width:50px}
</STYLE>
<SCRIPT type="text/javascript">
var fadeSpeed=20; loadCount=0
function WeSat(x){
for(i=1;i<9;i++){var newIMG=document.createElement("img");
if(navigator.appName!='Microsoft Internet Explorer'){
newIMG.setAttribute("class", "thum" );
}
else{ newIMG.setAttribute("className", "thum"); }
newIMG.setAttribute("onload",loadCount++);
newIMG.setAttribute("border", "1px solid green");
newIMG.setAttribute("title", i);
newIMG.setAttribute("src", ''+x+'.GIF.'+i+'.jpg');
document.getElementById("thumb").appendChild(newIMG);
}
if(loadCount==document.getElementById('thumb').getElementsByTagName('img').length){play()}
}
function play(){ di=document.getElementById('thumb').getElementsByTagName('img'); startFrom=0;
if(navigator.appName!='Microsoft Internet Explorer'){document.images[1].style.opacity=1}
else{document.images[1].filters.item(0).opacity=100}
document.images[0].src=document.images[1].src=di[startFrom].src;
setTimeout("fadePlay()",50)
}
function fadePlay(){
if(navigator.appName!='Microsoft Internet Explorer'){ if(document.images[1].style.opacity!=0){document.images[1].style.opacity-=.05; setTimeout("fadePlay()",fadeSpeed)}
else{ nextPlay() }
}
else{ if(document.images[1].filters.item(0).opacity>0){document.images[1].filters.item(0).opacity-=5;setTimeout("fadePlay()",fadeSpeed); }
else{ nextPlay() }
}
}
function nextPlay(){ di[startFrom].style.border='1px solid red'; document.images[1].src=di[startFrom].src;
if(navigator.appName!='Microsoft Internet Explorer'){document.images[1].style.opacity=1;}
else{document.images[1].filters.item(0).opacity=100}
setTimeout("playIt()",1)
}
function playIt(){
startFrom++; if(startFrom<di.length){ document.images[0].src=di[startFrom].src; fadePlay() }
else{for(i=0;i<di.length;i++){di[i].style.border='1px solid green';}}
}
</SCRIPT>
<META content="MSHTML 6.00.2900.2963" name=GENERATOR></HEAD>
<BODY scroll="auto" onload="WeSat('http://sat.wrh.noaa.gov/satellite/4km/NW/animation/WV4NW')">
<img style="position:absolute;top:0px;left:0px;" src="" alt="bottom">
<img style="opacity:1;position:absolute;top:0px;left:0px;filter:alpha(opacity=100);" src="" alt="top">
<div id="thumb" style="position:absolute;bottom:3px;left:3px;font-size:10px;"></div>
<div style="position:absolute;top:3px;right:3px;width:100px">
<input type=button onclick="play()" value="rePlay" >
</div>
</BODY></HTML>
11-04-2009, 07:31 PM
Threaded Mode