Manglende fade effekt i billedfremviser
Jeg håber, der er en af jer, der kan hjælpe med dette.Sagen er den, at jeg har en lille javascript kode, jeg bruger på min hjemmeside til fremvisning af 2 billeder her: www.zerious.dk
På første side skifter der 2 billeder, men den skiftning sker meget brat - og jeg vil foretrække, at det sker med en fade effekt, så overgangen fra 1 billede til 2 billeder er mere rolig.
Så er spørgsmålet, om jeg kan ændre det script jeg bruger til at have denne mere bløde effekt - og er der evt. en af jer, der kan vise mig hvordan scriptet så skal se ud???
Scriptet er her:
<script language="javascript" type="text/javascript">
var slideShowSpeed = 6000;
var crossFadeDuration = 3;
var Pic = new Array();
Pic[0] = 'images/forside1.jpg'
Pic[1] = 'images/forside2.jpg'
var t;
var j = 0;
var p = Pic.length;
var preLoad = new Array();
for (i = 0; i < p; i++) { preLoad[i] = new Image();
preLoad[i].src = Pic[i]; }
function runSlideShow(){
if (document.all) {
document.images.SlideShow.style.filter="blendTrans(duration=2)";
document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration)";
document.images.SlideShow.filters.blendTrans.Apply(); }
document.images.SlideShow.src = preLoad[j].src;
if (document.all){
document.images.SlideShow.filters.blendTrans.Play(); }
j = j + 1;
if (j > (p - 1)) j = 0;
t = setTimeout('runSlideShow()', slideShowSpeed); }
window.onload=runSlideShow;
</script>
Billede 1 der vises på skærmen:
<div id="banner">
<img src="images/forside1.jpg" name='SlideShow' width="600" height="440" alt=""/>
</div>
