Sådan ?-)
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"
http://www.w3.org/TR/html4/loose.dtd"><html>
<head>
<title>Fade slides</title>
<meta name="Generator" content="Stone's WebWriter 4">
<meta name="keywords" content="roenving,
http://www.eksperten.dk/spm/521949"><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
html,body{height:100%;margin:0px;border:0px;padding:0px;font-family:tahoma,verdana,arial,sans-serif;font-size:small;}
#slidecontainer{float:left;height:250px;width:250px;}
</style>
<script type="text/javascript" language="JavaScript1.2">
var slideshow_width='250px'; //SET IMAGE WIDTH
var slideshow_height='250px'; //SET IMAGE HEIGHT
var imagepath = "../";
var fimages = new Array();
fimages[fimages.length] = "billede1.jpg";
fimages[fimages.length] = "billede2.jpg";
fimages[fimages.length] = "billede3.jpg";
fimages[fimages.length] = "billede4.jpg";
fimages[fimages.length] = "billede5.jpg";
fimages[fimages.length] = "billede6.jpg";
fimages[fimages.length] = "billede7.jpg";
fimages[fimages.length] = "billede8.jpg";
fimages[fimages.length] = "billede9.jpg";
fimages[fimages.length] = "billede10.jpg";
var preloadedimages=new Array();
for (p=0;fimages.length>p;p++){
preloadedimages[p] = new Image();
preloadedimages[p].src = imagepath + fimages[p];
}
var slidelength = preloadedimages.length,curcanvas,curimageindex,actZ=100;
var OpC = new Array();
var ie = (document.all)?true:false;
var moz = (navigator.userAgent.indexOf("Gecko")>-1)
function startOpChange(elm,end,tim){
if(!ie&&!moz)return;
var idx = OpC.length;
for(var i=0;idx>i;i++){
if(OpC[i][0]==elm){
clearInterval(OpC[i][4]);
idx = i;
break;
}
OpC[idx] = new Array();
}
if(idx==0)OpC[idx] = new Array();
if(ie)actOp=elm.filters.alpha.opacity;
else actOp=Math.round((elm.style.MozOpacity*100));
if (actOp!=end){
OpC[idx][0]=elm;
OpC[idx][1]=actOp;
OpC[idx][2]=end;
OpC[idx][3]=(end>actOp)?1:-1;
var delayTime = Math.floor((tim*1000)/Math.abs((actOp-end)));
OpC[idx][4]=setInterval("opChange("+idx+")",delayTime);
}
}
function opChange(idx){
OpC[idx][1]+=OpC[idx][3];
if (ie)OpC[idx][0].filters.alpha.opacity=OpC[idx][1];
else OpC[idx][0].style.MozOpacity=Math.min(0.9999,OpC[idx][1]/100);
if (OpC[idx][1]==OpC[idx][2]){
clearInterval(OpC[idx][4]);
return;
}
}
function initSlide(){
var c = document.getElementById('slidecontainer');
with(c.style){
position='relative';
overflow='hidden';
width=slideshow_width;
height=slideshow_height;
}
if (ie||moz){
for(i=0;2>i;i++){
var im = document.createElement('IMG');
c.appendChild(im);
with(im.style){
position='absolute';
top=left='0px';
width=slideshow_width;
height=slideshow_height;
filter='alpha(opacity=5)';
MozOpacity='0.05';
zIndex = ++actZ;
}
im.id = 'canvas'+i;
im.src = preloadedimages[i].src;
im.alt = fimages[i];
if(i==0)startOpChange(im,100,1);
}
}else{
var im = document.createElement('IMG');
c.appendChild(im);
with(im.style){
position='absolute';
top=left='0px';
width=slideshow_width;
height=slideshow_height;
}
im.id = "canvas"
im.src = preloadedimages[0].src;
im.alt = fimages[0];
im.style.zIndex = 0;
}
curcanvas="canvas1";
curimageindex=0;
}
function nextSlide(dir){
startOpChange(document.getElementById(curcanvas),5,1);
curcanvas = 'canvas' + ((curcanvas=='canvas0')?1:0);
var im = document.getElementById(curcanvas);
curimageindex = (curimageindex+dir)%slidelength;
curimageindex = (curimageindex==-1)?slidelength-1:curimageindex;
im.src = preloadedimages[curimageindex].src;
im.alt = fimages[curimageindex];
im.style.zIndex += 1;
startOpChange(im,100,1);
}
function rotateimage(dir){
var im = document.getElementById('canvas');
curimageindex = (curimageindex+dir)%slidelength;
im.src = preloadedimages[curimageindex].src;
im.alt = fimages[curimageindex];
}
function next(dir){
if (ie||moz)
nextSlide(dir);
else
rotateimage(dir);
}
window.onload = initSlide;
</script>
</head>
<body>
<div id="slidecontainer"></div>
<div id="">
<br><br><br><br><br><br>
<button onclick="next(-1)">^</button><br>
<button onclick="next(1)">v</button>
</div>
</body>
</html>
