Avatar billede marvinq Nybegynder
10. september 2007 - 10:48 Der er 10 kommentarer og
1 løsning

Hjælp til billedeskift

Jeg har tyvstjålet følgende kode fra "grunken", som tidligere har skrevet dette i en tråd... men kan det ikke lade sig gøre, at billederne fader sammen i stedet for bare brat at skifte uden nogen form for overgang??

/MHQ


<script language="JavaScript" type="text/javascript">

var tid = 5; //antal sekunder mellem skift af banner

var banners = new Array();
var bannerl = new Array();

//tilføj banner og links
  banners[0] = "photo_01.jpg";
  bannerl[0] = "www.eksperten.dk";

  banners[1] = "photo_02.jpg"
  bannerl[1] = "www.eksperten.dk"
 
  banners[2] = "photo_04.jpg"
  bannerl[2] = "www.eksperten.dk"

  banners[3] = "photo_05.jpg"
  bannerl[3] = "www.eksperten.dk"

  banners[4] = "photo_09.jpg"
  bannerl[4] = "www.eksperten.dk"


//Sjove funktioner
var a=new Array(banners.length),timer;
for (i=0;i<a.length;i++){
a[i]=i;
}

function initbanner() {
i=0,t=0,s=0;
  for (i = 0 ; i < a.length ; i++ ) {
  t = Math.floor(Math.random() * a.length);
  s = a[i];
  a[i] = a[t] ;
  a[t] = s;
  }
}

function visbanner(num){
if(!num){
  num=0;
  initbanner();
}
document.getElementById("blink").href = "http://"+bannerl[a[num]];
document.getElementById("bimg").src = banners[a[num]];
  if(num!=a.length-1)
  timer = setTimeout("visbanner("+(++num)+")",1000*tid);
  else
  timer = setTimeout("visbanner()",1000*tid);
}
</script>

<body onload="visbanner()">
<a href="" id="blink" target="_blank"><img id="bimg"/ border="0"></a>
</body>
Avatar billede Slater Ekspert
10. september 2007 - 11:07 #1
Noget i stil med det jeg har gjort på http://teolog.nu ?
Avatar billede Keld Nielsen Professor
10. september 2007 - 17:11 #2
Du kan jo få inspiration på hvordan de har lavet det:
http://teolog.nu/script/rotator.js
;-)
Avatar billede marvinq Nybegynder
10. september 2007 - 18:55 #3
Det er lige nøjagtig som på teolog.nu !!

Har du et sample af koden, sådan kogt lidt ned :)

/MHQ
Avatar billede Slater Ekspert
10. september 2007 - 19:00 #4
Ja, fotografen har jo linket til Javascript-filen. Nu har jeg lavet den funktion så den bare henter billeder, der hedder noget med front#.jpg i undermappen /images. Men hvis du kigger på funktionen preload(), er det hurtigt at skrive den om til at hente andre billeder.

Du kunne evt. flytte din egen kode ind i den funktion, og så bare omdøbe banners[] til splash_im[] (eller omvendt). Og husk at sætte konstanten IMAGES i 5. linje til det totale antal af billeder.
Avatar billede marvinq Nybegynder
11. september 2007 - 14:22 #5
Det er en super hjælp indtil videre. Har tyvstjålet med arme og ben :) Men der er et lille problem, som jeg ikke helt kan løse.

Har lånt lidt hotel plads her: http://www.minstemme.dk/billede/nu.html - Det er som om at billedet lige udvider sig med 5-6 pixels i bunden efter den er fadet helt ind. Nogen forklaring på dette? Og kan det ikke rettes op på?

/MHQ
Avatar billede Keld Nielsen Professor
11. september 2007 - 14:30 #6
Er du sikker på at alle billeder har samme størrelse ?
Avatar billede marvinq Nybegynder
11. september 2007 - 14:46 #7
Nu er det ikke de billeder som der skal bruges, men jo - de er alle sammen 775x436 pixels.

Har forsøgt at sætte på næsten alt, men lige meget hjælper det.

/MHQ
Avatar billede Slater Ekspert
11. september 2007 - 15:51 #8
Det er en fejl i IE. Det virker fint på andre browsere, og det kan afhjælpes ved at sætte følgende i CSS:

#splashcnt {
    background-image: url("photo_01.jpg");
    width: 775px;
    height: 436px;
    overflow: hidden;
}
Avatar billede marvinq Nybegynder
11. september 2007 - 15:57 #9
okay! havde ikke lige overvejet at teste den i andre browsere... men må da hellere lige prøve det der.

Vender lige tilbage
Avatar billede marvinq Nybegynder
12. september 2007 - 10:34 #10
Det virkede sq ! :)

Takker mange gange. Smid et svar !

/MHQ
Avatar billede Slater Ekspert
12. september 2007 - 17:01 #11
Så gerne :)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester