Søg
Avatar billede tejs Nybegynder
08. november 2001 - 18:54 Der er 16 kommentarer og
1 løsning

Images rotator

Hej

Jeg er ved at være færdig med min siden, men jeg mangler et script, som kan skifte nogle billeder ud...

Jeg har 6 billeder på siden og 33 billeder i alt som jeg gerne vil have til at blive vist. Hver af de 6 billeder skal så stå og skifte sig selv ud med et af de andre 32 billeder. Dette må gerne være tilfældigt, men hastighed og rækkefølge må ikke være det samme..

Jeg har prøvet med dette script:
<script language=JavaScript>
var billedSkift=new Array();
billedSkift[0]=\"images/mini/1.jpg\";
billedSkift[1]=\"images/mini/2.jpg\";
billedSkift[2]=\"images/mini/3.jpg\";
billedSkift[3]=\"images/mini/33.gif\";
billedSkift[4]=\"images/mini/4.jpg\";
var billede = 0;
function Rotate(){
if (++billede > 4) billede = 0;
document.images.billedSkiftrotate6.src = billedSkift[billede]
onload=window.setTimeout(\'Rotate();\',500);
}
</script>

Det virker fint, men kan kun køre på et billede - da det aktiveres fra onload...

Findes der et script der kan gøre det eller er det muligt at lave det jeg allerede har om..?

MVH Tejs
Avatar billede tejs Nybegynder
08. november 2001 - 18:55 #1
Jeg fandt scriptet i spørgsmålet: http://www.eksperten.dk/spm/40681
Avatar billede jakoba Nybegynder
08. november 2001 - 19:20 #2

<script language=JavaScript>
var billedSkift=new Array();
billedSkift[0]=\"images/mini/1.jpg\";
billedSkift[1]=\"images/mini/2.jpg\";
billedSkift[2]=\"images/mini/3.jpg\";
billedSkift[3]=\"images/mini/33.gif\";
billedSkift[4]=\"images/mini/4.jpg\";
var billede = 0;

function Rotate( imgId ){
    if (++billede > 4) billede = 0;
    document.images[imgId].src = billedSkift[billede]
    window[imgId+\"handle\"] = setTimeout( \'Rotate(\"\'+imgId+\'\");\', 300+Math.random()*400 );
}

function startIt() {
    window.billedSkiftrotate1handle = setTimeout( \"rotate(\'billedSkiftrotate1\')\", Math.random()* 600 );
    window.billedSkiftrotate2handle = setTimeout( \"rotate(\'billedSkiftrotate2\')\", Math.random()* 600 );
    window.billedSkiftrotate3handle = setTimeout( \"rotate(\'billedSkiftrotate3\')\", Math.random()* 600 );
    window.billedSkiftrotate4handle = setTimeout( \"rotate(\'billedSkiftrotate4\')\", Math.random()* 600 );
    window.billedSkiftrotate5handle = setTimeout( \"rotate(\'billedSkiftrotate5\')\", Math.random()* 600 );
    window.billedSkiftrotate6handle = setTimeout( \"rotate(\'billedSkiftrotate6\')\", Math.random()* 600 );
};

window.onload = startIt;

</script>

mvh JakobA
Avatar billede caturn Nybegynder
08. november 2001 - 19:32 #3
Det her er skrevet til en banner rotator men det kan vel hurtigt laves om!


<HEAD>
<SCRIPT LANGUAGE=\"JavaScript\">
var mfBanners = [
[\'http://www.banner1-url-here.com\', \'http://imageserv.imgis.com/images/Ad13700St1Sz1Sq1_Ban1.gif\'],
[\'http://www.banner2-url-here.com\', \'http://imageserv.imgis.com/images/Ad13189St1Sz1Sq5_Ban10.gif\']
];
var mfIe = false;
if( document.all) {
mfIe = true;
}
var mfBannerIndex = 0;
function mfBannerChange() {
var htmlString = \'<a target=\"_blank\" href=\"\'+mfBanners[mfBannerIndex][0]+\'\"> <img border=\"0\" src=\"\'+mfBanners[mfBannerIndex][1]+\'\"></a>\';
if( mfIe) {
document.all.banner.innerHTML = htmlString;
}
else {
document.layers[\"banner\"].document.open();
document.layers[\"banner\"].document.write( htmlString);
document.layers[\"banner\"].document.close();
}
if(mfBannerIndex < mfBanners.length - 1)
mfBannerIndex++;
else
mfBannerIndex = 0;
}
setInterval(\"mfBannerChange()\", 5000);
</script>
</HEAD>
<BODY>
<div id=\"banner\" style=\"position:absolute; top:300; left:171;\"></div>
Avatar billede tejs Nybegynder
08. november 2001 - 19:42 #4
til jakoba: Hvilken effekt har de ændringer du har lavet?
Avatar billede tejs Nybegynder
08. november 2001 - 19:42 #5
Er der noget tilfældigheds halløj med?
Avatar billede tejs Nybegynder
08. november 2001 - 19:44 #6
Hvilken kode skal jeg skrive ved billederne,
skal de ikke have et navn?
Avatar billede tejs Nybegynder
08. november 2001 - 19:45 #7
Ahhh - ok - billederne skal have navnet billedSkiftrotate1(til 6), men hvad med rotate hastigheden er den defineret nogen steder?
Avatar billede jakoba Nybegynder
08. november 2001 - 19:49 #8
Næe, vi skal jo forhindre at samme billede vises flere gange:

<script language=JavaScript>

var billedSkift=new Array(  // alle billederne
\"images/mini/1.jpg\", \"images/mini/2.jpg\", \"images/mini/3.jpg\",
\"images/mini/4.gif\", \"images/mini/5.jpg\", \"images/mini/6.jpg\",
\"images/mini/7.jpg\", \"images/mini/8.jpg\", \"images/mini/9.jpg\",
\"images/mini/10.gif\", \"images/mini/11.jpg\", \"images/mini/12.jpg\",
\"images/mini/13.jpg\", \"images/mini/14.jpg\", \"images/mini/15.jpg\",
\"images/mini/16.gif\", \"images/mini/17.jpg\", \"images/mini/18.jpg\",
\"images/mini/19.jpg\", \"images/mini/20.jpg\", \"images/mini/21.jpg\",
\"images/mini/22.gif\", \"images/mini/23.jpg\", \"images/mini/24.jpg\",
\"images/mini/25.jpg\", \"images/mini/26.jpg\", \"images/mini/27.jpg\",
\"images/mini/28.gif\", \"images/mini/29.jpg\", \"images/mini/30.jpg\",
\"images/mini/31.jpg\", \"images/mini/32.jpg\", \"images/mini/33.jpg\",
\"images/mini/34.gif\", \"images/mini/35.jpg\", \"images/mini/36.jpg\"  //ikke komma efter sidste
                              );

var aktiv = new Array();
for (i=0; i<billedSkift.length; i++ ) {
    aktiv[i] = false;
}

var bilde = new Array();
for (i=1; i<=6; i++ ) {
    bilde[i] = new Object();
    bilde[i].aktivt = -1;
    bilde[i].imgId = \"billedSkiftrotate\"+i;
    bilde[i].handle = 0;
}
   
var billede;

function Rotate( imgNr ){
    while ( aktiv[ billede = Math.floor(Math.random()*billedSkift.length) ] ) { };
    document.images[bilde[imgNr].imgId].src = billedSkift[billede];
    if ( bilde[imgNr].aktivt >= 0 ) aktiv[ bilde[imgNr].aktivt ] = false;
    bilde[imgNr].aktivt = billede
    aktiv[ billede ] = true;
    bilde[ imgNr ].handle = setTimeout( \'Rotate(\'+imgNr+\');\', 600+Math.random()*600 );
}

function startIt() {
    for ( i=1; i<=6; i++ ) {
        bilde[i].handle = setTimeout( \"rotate(\"+i+\")\", Math.random()* 700 );
    }
};

window.onload = startIt;

</script>
Avatar billede tejs Nybegynder
08. november 2001 - 19:55 #9
Det ser skide godt ud, men jeg har lige et par spørgsmål..

- Hvad sker der når alle billederne har kørt igennem en gang?
- Hvilke navne skal jeg give mine 6 billeder?
- Jeg vil gerne kunne angive en forskellige
rotate-hastighed på hvert billede - kan jeg det?
Avatar billede jakoba Nybegynder
08. november 2001 - 19:56 #10
du skal ikke skrive nogen kode ved billederne.
billederne skal have navne
<img name=\"billedSkiftrotate1\" src=\'billednavn.jpg\' width=123 height=345>
...
<img name=\"billedSkiftrotate6\" src=\'billednavn.jpg\' width=123 height=345>
og du bør ogsp give dem en width og height parameter svarende til dine billeder.
i anden version er der god tilfældighedshalloj med og alle biller kan blive vist i alle <img kommandoer, men aldrig samtidig.
rotatehastigheden er mellem 600 og 1200 millisekunder for <img kommando. med 6 <img kommandoer betyder det at noget på siden skifter ca hver 150 millisekunder.

mvh JakobA
Avatar billede jakoba Nybegynder
08. november 2001 - 20:03 #11
du kan angive en specifik roterehastighed for de enkelte billeder her:

var bilde = new Array();
for (i=1; i<=6; i++ ) {
    bilde[i] = new Object();
    bilde[i].aktivt = -1;
    bilde[i].imgId = \"billedSkiftrotate\"+i;
    bilde[i].handle = 0;
}
bilde[1].hastighed = 600;  // giv billederne hastigheder
bilde[2].hastighed = 800;
bilde[3].hastighed = 600;
bilde[4].hastighed = 800;
bilde[5].hastighed = 600;
bilde[6].hastighed = 800;

og så ændre sidste linie i funktionen Rotate til:
    bilde[ imgNr ].handle = setTimeout( \'Rotate(\'+imgNr+\');\', bilde[imgNr].hastighed );

Ups. i funktionen startIt har jeg stavet Rotate med lille R. Der er nok også andre fejl.

mvh JakobA
Avatar billede tejs Nybegynder
08. november 2001 - 20:06 #12
Øhhh..

Hvordan ser det ud samlet..?
Avatar billede jakoba Nybegynder
08. november 2001 - 20:14 #13
<script language=JavaScript>

var billedSkift=new Array(  // alle billederne
\"images/mini/1.jpg\", \"images/mini/2.jpg\", \"images/mini/3.jpg\",
\"images/mini/4.gif\", \"images/mini/5.jpg\", \"images/mini/6.jpg\",
\"images/mini/7.jpg\", \"images/mini/8.jpg\", \"images/mini/9.jpg\",
\"images/mini/10.gif\", \"images/mini/11.jpg\", \"images/mini/12.jpg\",
\"images/mini/13.jpg\", \"images/mini/14.jpg\", \"images/mini/15.jpg\",
\"images/mini/16.gif\", \"images/mini/17.jpg\", \"images/mini/18.jpg\",
\"images/mini/19.jpg\", \"images/mini/20.jpg\", \"images/mini/21.jpg\",
\"images/mini/22.gif\", \"images/mini/23.jpg\", \"images/mini/24.jpg\",
\"images/mini/25.jpg\", \"images/mini/26.jpg\", \"images/mini/27.jpg\",
\"images/mini/28.gif\", \"images/mini/29.jpg\", \"images/mini/30.jpg\",
\"images/mini/31.jpg\", \"images/mini/32.jpg\", \"images/mini/33.jpg\",
\"images/mini/34.gif\", \"images/mini/35.jpg\", \"images/mini/36.jpg\"  //ikke komma efter sidste
                              );

var aktiv = new Array();
for (i=0; i<billedSkift.length; i++ ) {
    aktiv[i] = false;
}

var bilde = new Array();
for (i=1; i<=6; i++ ) {
    bilde[i] = new Object();
    bilde[i].aktivt = -1;
    bilde[i].imgId = \"billedSkiftrotate\"+i;
    bilde[i].handle = 0;
}
bilde[1].hastighed = 600;  // giv billederne hastigheder
bilde[2].hastighed = 800;
bilde[3].hastighed = 600;
bilde[4].hastighed = 800;
bilde[5].hastighed = 600;
bilde[6].hastighed = 800;
   
var billede;

function Rotate( imgNr ){
    while ( aktiv[ billede = Math.floor(Math.random()*billedSkift.length) ] ) { };
    document.images[bilde[imgNr].imgId].src = billedSkift[billede];
    if ( bilde[imgNr].aktivt >= 0 ) aktiv[ bilde[imgNr].aktivt ] = false;
    bilde[imgNr].aktivt = billede;
    aktiv[ billede ] = true;
    bilde[ imgNr ].handle = setTimeout( \'Rotate(\'+imgNr+\');\', bilde[imgNr].hastighed );
}

function startIt() {
    for ( i=1; i<=6; i++ ) {
        bilde[i].handle = setTimeout( \"Rotate(\"+i+\")\", Math.random()* 900 );
    }
};

window.onload = startIt;

</script>
Avatar billede tejs Nybegynder
08. november 2001 - 20:28 #14
Det er super fedt!!!!, men det virker ikke i Netscape 6..!!?
Det virker dog fint i den gamle NS 4.73..
Hvad er der galt?
Avatar billede jakoba Nybegynder
08. november 2001 - 20:51 #15
Det kan jeg ikke fortælle dig for det virker fint i min NS6
\"Mozilla/5.0 (Windows; U; Win98; en-US; m18) Gecko/20001108 Netscape6/6.0\"

Huskede du at slette cashe så der ikke er gamle versoiner der ku blande sig i testen?

det kan nu og da være god at give NS6 BÅDE et navn og en id.
dvs i billederne:
<img name=\"billedSkiftrotate6\" id=\"billedSkiftrotate6\"
src=\'billednavn.jpg\' width=123 height=345>

men jeg mener det burde virke.

ps jeg ville nok sætte hastigheden lidt ned (større tal i setTimeout kaldet nederst i funktionen rotate).

mvh JakobA


Avatar billede artery_graphics Nybegynder
08. november 2001 - 21:52 #16
Jeg svarer lige på Tejs\' vegne, da jeg har været med til at lave siden. Jeg HAR netop testet den i Netscape 6 og den virker perfekt.

Tak for hjælpen. Det er et super godt script!
Avatar billede jakoba Nybegynder
11. november 2001 - 02:47 #17
?
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
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra JavaScript kategorien

Titel Indlæg Oprettet Seneste aktivitet
problem med download i <a href=" " download> tag i JavaScript Af Peer i JavaScript 5 27/04/202620:09 21/08/202610:41
Validering af filnavn i formular Af Strawberry i JavaScript 8 14/04/202610:11 20/04/202611:14
Mangler et JavaScript til htm side med iframe i Joomla5 Af Peder Lund Nielsen i JavaScript 2 03/02/202614:19 04/04/202616:02
Åbne en PDF fil fra en mappe Af mbl i JavaScript 9 18/04/202516:52 22/04/202512:33
Spørgsmål til cookies Af Mads i JavaScript 2 14/02/202511:47 27/06/202514:34
Se alle spørgsmål i kategorien Opret spørgsmål

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.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
I går 17:41 NVIDIA Geforce GTX 1060 6 GB som "snakker" Af dcedata1977 i Andet hardware
27/0916:43 Nomad Tracking Car Af fleknes i Apps til Android
25/0916:15 Internet forsvinder hele tiden Af TTA i Internetforbindelser
23/0920:49 Fejl på Tv2 Play Af Bukse i Browsere
23/0918:11 VB, Lægge 2 celler sammen og skrive den i cellen ved side af Af MC3390 i Excel
White papers
Flere white papers »