Søg
Avatar billede kimmys Nybegynder
04. marts 2006 - 02:41 Der er 8 kommentarer og
1 løsning

Forskellige baggrundsbilleder i tabel

Jeg har et script som jeg bruger til at vise forskellige billeder på min hjemmeside, men nu vil jeg også gerne bruge det til at vise forskellige baggrunde i en tabel.

Sådan ser det ud:

<script type="text/JavaScript" src="rand.js"></script>
   
    <script type="text/JavaScript">
    document.write(randPic.pic);
                  </script>


Jeg har selv prøvet med en kode, som nok bare mest viser at jeg ikke har forstand på Java scripts =) men så har I jo lidt at grive af! =)

<script type="text/JavaScript" src="rand.js"></script>
   
    <script type="text/JavaScript">
    document.write("<td background='" + randPic.pic +  "' ">" );
    }
                    </script>   


Håber at der er en som har mere styr på det end mig, som vil hjælpe!
Avatar billede psykochicken Nybegynder
05. marts 2006 - 01:52 #1
Hvis du har 3 baggrundsbilleder, som du navngiver fortløbende ex: billede1.jpg, billede2.jpg og billede 3.jpg, kan du lave noget i stil med:

indholdet af rand.js:
var imgs = new Array();
for(i=0;i<3;i++){
imgs[i] = new Image;
imgs[i].pic = "billede"+(i+1)+".jpg";
}
function skift(){
nummer=Math.floor(Math.random()*3);
var billede="url("+imgs[nummer].pic+")";
document.getElementById("tab1").style.backgroundImage = billede;
}

og på siden:
<script type="text/javascript" src="rand.js"></script>
</head>
<body onload="skift()">
<table id="tab1".....osv

/psc
Avatar billede kimmys Nybegynder
05. marts 2006 - 22:30 #2
jeg har allerede en rand.js som jeg gerne vil bruge, problemet var mere at få randPic.pic ind i en tabel :D

rand.js ser sådan ud:

var arrBilleder = new Array();
arrBilleder[0] = "Sider/rand/img1.jpg";
arrBilleder[1] = "Sider/rand/img2.jpg";
arrBilleder[2] = "Sider/rand/img3.jpg";
arrBilleder[3] = "Sider/rand/img4.jpg";
arrBilleder[4] = "Sider/rand/img5.jpg";
arrBilleder[5] = "Sider/rand/img6.jpg";
arrBilleder[6] = "Sider/rand/img7.jpg";
arrBilleder[7] = "Sider/rand/img8.jpg";
arrBilleder[8] = "Sider/rand/img9.jpg";
arrBilleder[9] = "Sider/rand/img10.jpg";
arrBilleder[10] = "Sider/rand/img11.jpg";
arrBilleder[11] = "Sider/rand/img12.jpg";
arrBilleder[12] = "Sider/rand/img13.jpg";
arrBilleder[13] = "Sider/rand/img14.jpg";
arrBilleder[14] = "Sider/rand/img15.jpg";
arrBilleder[15] = "Sider/rand/img16.jpg";
arrBilleder[16] = "Sider/rand/img17.jpg";
arrBilleder[17] = "Sider/rand/img18.jpg";
arrBilleder[18] = "Sider/rand/img19.jpg";
arrBilleder[19] = "Sider/rand/img20.jpg";
arrBilleder[20] = "Sider/rand/img21.jpg";
arrBilleder[21] = "Sider/rand/img22.jpg";
arrBilleder[22] = "Sider/rand/img23.jpg";
arrBilleder[23] = "Sider/rand/img24.jpg";
arrBilleder[24] = "Sider/rand/img25.jpg";
arrBilleder[25] = "Sider/rand/img26.jpg";
arrBilleder[26] = "Sider/rand/img27.jpg";
arrBilleder[27] = "Sider/rand/img28.jpg";
arrBilleder[28] = "Sider/rand/img29.jpg";
arrBilleder[29] = "Sider/rand/img30.jpg";


function getRandPic() {
    var aRand, tmp, nD, myD, myM;
    aRand = [11,6,22,13,3,5,17,13,10,3,14,4,23,2,14,9,6,15,14,16,12,22,0,20,9,7,24,2,4,11,19,29,1,5,7,25,0,16,21,12,24,2,4,11,1,28];
    nD = new Date();
    nD.setDate(nD.getDate() - ((nD.getDay() + 6) % 7));
    myM = nD.getMonth()+1;
    myD = nD.getDate();

    for ( i=0; i<myM; i++) {
        tmp = aRand.shift();
        aRand.push(tmp);
    }
    return { "pic":"<img src=\"" + arrBilleder[aRand[myD]] + "\">", "txt":arrTekster[aRand[aRand.length-myD]] };
}
var randPic = getRandPic();

Håber du kan mixe de 2 koder sammen ! :D
Avatar billede kimmys Nybegynder
06. marts 2006 - 00:01 #3
eller hvis andre vil hjælpe..
Avatar billede psykochicken Nybegynder
06. marts 2006 - 17:02 #4
ok - en sammenskrivning ville blive noget i stil med:

rand.js:
var arrBilleder = new Array();
for(i=0;i<30;i++){
arrBilleder[i] = new Image;
arrBilleder[i].pic = "billede"+(i+1)+".jpg";
}
function getRandPic() {
    var aRand, tmp, nD, myD, myM;
    aRand = [11,6,22,13,3,5,17,13,10,3,14,4,23,2,14,9,6,15,14,16,12,22,0,20,9,7,24,2,4,11,19,29,1,5,7,25,0,16,21,12,24,2,4,11,1,28];
    nD = new Date();
    nD.setDate(nD.getDate() - ((nD.getDay() + 6) % 7));
    myM = nD.getMonth()+1;
    myD = nD.getDate();

    for ( i=0; i<myM; i++) {
        tmp = aRand.shift();
        aRand.push(tmp);
    }
    var billede="url("+arrBilleder[aRand[myD]].pic+")";
    document.getElementById("tab1").style.backgroundImage = billede;
    document.getElementById("myimg").src = arrBilleder[aRand[myD]].pic;

}
window.onload=getRandPic;


<script type="text/javascript" src="rand.js"></script>
</head>
<body>
<table id="tab1"........osv

eller mente du en funktion, der kan begge dele ?

/psc
Avatar billede psykochicken Nybegynder
06. marts 2006 - 17:03 #5
hov....fjern lige linien:
document.getElementById("myimg").src = arrBilleder[aRand[myD]].pic;
Avatar billede kimmys Nybegynder
06. marts 2006 - 22:50 #6
nej nej den behøver ikke kunne begge dele.. men synes ikke jeg kan få den til at virke..

rand.js:
var arrBilleder = new Array();
arrBilleder[0] = "Sider/rand/img1.jpg";
arrBilleder[1] = "Sider/rand/img2.jpg";
arrBilleder[2] = "Sider/rand/img3.jpg";
arrBilleder[3] = "Sider/rand/img4.jpg";
arrBilleder[4] = "Sider/rand/img5.jpg";
arrBilleder[5] = "Sider/rand/img6.jpg";
arrBilleder[6] = "Sider/rand/img7.jpg";
arrBilleder[7] = "Sider/rand/img8.jpg";
arrBilleder[8] = "Sider/rand/img9.jpg";
arrBilleder[9] = "Sider/rand/img10.jpg";
arrBilleder[10] = "Sider/rand/img11.jpg";
arrBilleder[11] = "Sider/rand/img12.jpg";
arrBilleder[12] = "Sider/rand/img13.jpg";
arrBilleder[13] = "Sider/rand/img14.jpg";
arrBilleder[14] = "Sider/rand/img15.jpg";
arrBilleder[15] = "Sider/rand/img16.jpg";
arrBilleder[16] = "Sider/rand/img17.jpg";
arrBilleder[17] = "Sider/rand/img18.jpg";
arrBilleder[18] = "Sider/rand/img19.jpg";
arrBilleder[19] = "Sider/rand/img20.jpg";
arrBilleder[20] = "Sider/rand/img21.jpg";
arrBilleder[21] = "Sider/rand/img22.jpg";
arrBilleder[22] = "Sider/rand/img23.jpg";
arrBilleder[23] = "Sider/rand/img24.jpg";
arrBilleder[24] = "Sider/rand/img25.jpg";
arrBilleder[25] = "Sider/rand/img26.jpg";
arrBilleder[26] = "Sider/rand/img27.jpg";
arrBilleder[27] = "Sider/rand/img28.jpg";
arrBilleder[28] = "Sider/rand/img29.jpg";
arrBilleder[29] = "Sider/rand/img30.jpg";


var arrBilleder = new Array();
for(i=0;i<30;i++){
arrBilleder[i] = new Image;
arrBilleder[i].pic = "billede"+(i+1)+".jpg";
}
function getRandPic() {
    var aRand, tmp, nD, myD, myM;
    aRand = [11,6,22,13,3,5,17,13,10,3,14,4,23,2,14,9,6,15,14,16,12,22,0,20,9,7,24,2,4,11,19,29,1,5,7,25,0,16,21,12,24,2,4,11,1,28];
    nD = new Date();
    nD.setDate(nD.getDate() - ((nD.getDay() + 6) % 7));
    myM = nD.getMonth()+1;
    myD = nD.getDate();

    for ( i=0; i<myM; i++) {
        tmp = aRand.shift();
        aRand.push(tmp);
    }
    var billede="url("+arrBilleder[aRand[myD]].pic+")";
    document.getElementById("tab1").style.backgroundImage = billede;

}
window.onload=getRandPic;


Siden:

<html>

<head>
    <title></title>
<script type="text/javascript" src="rand.js"></script>
</head>

<body>
<table id="tab1" width="100%">
    <tr>
        <td></td>
    </tr>
</table>

</body>

</html>
Avatar billede psykochicken Nybegynder
07. marts 2006 - 18:28 #7
Ok - du får lige koden med de rigtige navne til dine billeder:

Først en lille forklaring:
din liste med billeder kan ENTEN være:
var arrBilleder = new Array();
arrBilleder[0] = new Image;
arrBilleder[0].pic = "Sider/rand/img1.jpg";
arrBilleder[1] = new Image;
arrBilleder[1].pic = "Sider/rand/img2.jpg";
...osv

ELLER da navnene er fortløbende kan det sammenskrives til:
var arrBilleder = new Array();
for(i=0;i<30;i++){
arrBilleder[i] = new Image;
arrBilleder[i].pic = "Sider/rand/img"+(i+1)+".jpg";


Derfor skal rand.js KUN indeholde:

var arrBilleder = new Array();
for(i=0;i<30;i++){
arrBilleder[i] = new Image;
arrBilleder[i].pic = "Sider/rand/img"+(i+1)+".jpg";
}
function getRandPic() {
    var aRand, tmp, nD, myD, myM;
    aRand = [11,6,22,13,3,5,17,13,10,3,14,4,23,2,14,9,6,15,14,16,12,22,0,20,9,7,24,2,4,11,19,29,1,5,7,25,0,16,21,12,24,2,4,11,1,28];
    nD = new Date();
    nD.setDate(nD.getDate() - ((nD.getDay() + 6) % 7));
    myM = nD.getMonth()+1;
    myD = nD.getDate();

    for ( i=0; i<myM; i++) {
        tmp = aRand.shift();
        aRand.push(tmp);
    }
    var billede="url("+arrBilleder[aRand[myD]].pic+")";
    document.getElementById("tab1").style.backgroundImage = billede;
    document.getElementById("myimg").src = arrBilleder[aRand[myD]].pic;

}
window.onload=getRandPic;

/psc
Avatar billede kimmys Nybegynder
07. marts 2006 - 19:00 #8
nu ser det ud til at virke :D tak! Kommer du med at svar..
Avatar billede psykochicken Nybegynder
07. marts 2006 - 20:39 #9
kommer her :o)
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 03/05/202613:59
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 dag 14:56 Udseende af datoer Af ErikHg i Excel
I går 09:37 hvilken AI synes I er bedst? Af jcr18 i Andre onlineløsninger
22/0518:51 Pausepil på youtube i chrome Af valby i Browsere
22/0511:42 Mail med endelsen ".lat" Af ErikHg i E-mail
21/0511:48 Nyåbnede sider flimrer på Android tablet, hvorfor Af annam i Andet software
White papers
Flere white papers »