14. april 2008 - 09:55Der er
57 kommentarer og 2 løsninger
Visning af tilfældige billeder
Hej exp'er
Jeg har en liste af billeder, som jeg skal have vist i en tilfældig orden, og der skal være links på alle billederne.
Jeg har endnu ikke haft held med at finde et, og mine egne javascript erfaringer har ikke haft held med at kode en selv, så nu vil jeg søge hjælp her hos jer :)
Det er en liste over sponsorer, der skal vises, og for at de ikke vises i den samme rækkefølge hver gang, så ville jeg finde et script, der ville vise dem i en tilfældig rækkefølge hver gang siden opdateres.
Denne side indeholder artikler med forskellige perspektiver på Identity & Access Management i private og offentlige organisationer. Artiklerne behandler aktuelle IAM-emner og leveres af producenter, rådgivere og implementeringspartnere.
Her er et meget simpelt stykke javaScript som løser dit lille problem.
Du skal bare sørge for, at billederne har følgende navne:
foto_1.jpg foto_2.jpg foto_3.jpg foto_4.jpg
OSV.......
Her i dette eksempel, har jeg sat antal billeder til 120 stk, men det kan du jo ændre. Evt læse antallet fra databasen i dit ASP dokument.
<script type="text/javascript"> // Lav et tilfældigt tal - Antallet af billedfiler er her 120 var nytTal; nytTal = Math.round(Math.random()*120)+1; // Hent billedet fra webserveren document.write("<img src='grafik/foto_" + nytTal + ".jpg' width='200' height = '200' alt = 'foto_"+ nytTal +".jpg'>"); </script>
Nej man kan lave det med inner.html i en div tag, men det er jo bare et simpelt eksempel jeg har lavet - kan godt lave et nyt udkast, bare fordi jeg syntes det er sjovt :-D
innerHTML har heller ikke nogen fremtid, da det strider lodret mod hele grundlaget for sgml og er direkte umuligt i x(ht)ml !-)
-- man kan dog også lave noget med at sætte elementerne ind, men hvis det, som jeg mistænker, drejer som en fast række af reklamer, der bare skal have variationer i rækkefølgen, kan man jo bare skrive dem ind fra start !o]
Synes godt om
Slettet bruger
14. april 2008 - 14:04#9
Scriptet er i og for sig fint nok, men det viser kun 1 billede.. jeg skal have det til at vise alle billeder, men i tilfældig rækkefølge hver gang siden opdateres..
Det script der er lavet her, har jeg prøvet at bruge før og ændre lidt i det, men kan ikke få det til at virke..
Så skal alle tal læses ind i et array - det er let at lave i ASP, men jeg skal lige tænke det igennem i javaScript samtidig med jeg skal dukke mig for roenving, for ikke at lave det for "gammeldags" hi hi
Synes godt om
Slettet bruger
14. april 2008 - 14:28#12
Ja, jeg har en liste på 45 sponsorer, der skal blandes tilfældigt.
De hedder allesammen sponsor_#.jpg - hvor # = et tal mellem 1 og 45.
var cont = document.getElementById("sponsorContainer"); var p = cont.getElementsByTagName("img"); var l = cont.getElementsByTagName("a"); for(i=0,im=p.length;im>;i++){ p[i].setAttribute("src",billeder[i]); l[i].setAttribute("href",lnks[i]); }
var cont = document.getElementById("sponsorContainer"); var p = cont.getElementsByTagName("img"); var l = cont.getElementsByTagName("a"); for(i=0,im=p.length;im>;i++){ p[i].setAttribute("src",billeder[nums[i]]); l[i].setAttribute("href",lnks[nums[i]]); }
Men - Det bliver hurtigt en træls kode at holde vedlige. Når du du nu arbejder i ASP ville jeg vælge at læse fra databasen frem for at skrive det ind i filen. Det betyder også at jeg ville skrive koden til ASP enten i javaScript eller vbScript afhængig af hvad den øvrige ASP kode er skrevet i.
Synes godt om
Slettet bruger
15. april 2008 - 09:01#21
Hvad skal der stå i href="" og i src="" ? for synes lige meget hvad, så virker det ikke...
Næh, det er underordnet, medmindre du vil starte med at der bliver vist noget ...
-- et større problem er det, at elementerne skal findes, før du går i gang med at indsætte, men f.eks.
... window.onload = function(){ var cont = document.getElementById("sponsorContainer"); var p = cont.getElementsByTagName("img"); var l = cont.getElementsByTagName("a"); for(i=0,im=p.length;im>;i++){ p[i].setAttribute("src",billeder[nums[i]]); l[i].setAttribute("href",lnks[nums[i]]); } } </script>
Kan stadig ikke få det til at virke. Hvis vi nu fjerne links så det kun er billederne der kører, kan vi gøre det? Så se om det kommer til at virke, for lige nu, så er der ingen visning af billeder. Kun små træls firkanter med røde krydser..
Det lyder da bare som om problemet er stierne til billederne, som ikke findes?
Synes godt om
Slettet bruger
22. april 2008 - 15:40#32
de ligger alle sammen i mappen data/media/ Og har også ændre stien i scriptet til det.. hvis det er fordi scriptet ikke kan holde til at man gør sådan, så må jeg jo flytte dem
Nej, så må scriptet rettes til, så det finder dem det rigtige sted. ;) Hvad hvis du starter alle stierne med /data og ikke data, dvs. med skråstreg først?
Synes godt om
Slettet bruger
22. april 2008 - 19:29#34
niks hjælper ikke.. har også prøvet at lade være med at lægge dem i mapper, og det virker heller ikke..
Stierne er rigtige nok, men det er de vel ikke her:
var billeder = ["sponsor_1.jpg","sponsor_2.jpg","sponsor_3.jpg","sponsor_4.jpg","sponsor_5.jpg","sponsor_6.jpg","sponsor_7.jpg","sponsor_8.jpg","sponsor_9.jpg","sponsor_10.jpg","sponsor_11.jpg","sponsor_12.jpg","sponsor_13.jpg","sponsor_14.jpg","sponsor_15.jpg","sponsor_16.jpg","sponsor_17.jpg","sponsor_18.jpg","sponsor_19.jpg","sponsor_20.jpg","sponsor_21.jpg","sponsor_22.jpg","sponsor_23.jpg","sponsor_24.jpg","sponsor_25.jpg","sponsor_26.jpg","sponsor_27.jpg","sponsor_28.jpg","sponsor_29.jpg","sponsor_30.jpg","sponsor_31.jpg","sponsor_32.jpg","sponsor_33.jpg","sponsor_34.jpg","sponsor_35.jpg","sponsor_36.jpg","sponsor_37.jpg","sponsor_38.jpg","sponsor_39.jpg","sponsor_40.jpg","sponsor_41.jpg","sponsor_42.jpg","sponsor_43.jpg","sponsor_44.jpg","sponsor_45.jpg"];
Jeg tror, du skal indsætte "data/media/" foran alle disse billednavne..
Det er rigtigt, der bliver aldrig sat nogle stier på sponsorbillederne, derfor bliver de heller ikke vist. Vi ka' lige debugge så.
Ret:
window.onload = function(){ var cont = document.getElementById("sponsorContainer"); var p = cont.getElementsByTagName("img"); var l = cont.getElementsByTagName("a"); for(i=0,im=p.length;im>i;i++){ p[i].setAttribute("src",billeder[nums[i]]); l[i].setAttribute("href",lnks[nums[i]]); } }
til:
window.onload = function(){ var cont = document.getElementById("sponsorContainer"); var p = cont.getElementsByTagName("img"); var l = cont.getElementsByTagName("a"); for(i=0,im=p.length;im>i;i++){ alert(p[i]); p[i].setAttribute("src",billeder[nums[i]]); l[i].setAttribute("href",lnks[nums[i]]); } }
Synes godt om
Slettet bruger
23. april 2008 - 10:16#41
jeg sidder og tænker på om det er noget i denne linie, der skal ændres:
Præcis! Den del, som skulle vise billederne, bliver aldrig kørt!
Prøv lige:
window.onload = function(){ var cont = document.getElementById("sponsorContainer"); var p = cont.getElementsByTagName("img"); var l = cont.getElementsByTagName("a"); alert("P: "+p.length+" - l: "+l.length); for(i=0,im=p.length;im>i;i++){ p[i].setAttribute("src",billeder[nums[i]]); l[i].setAttribute("href",lnks[nums[i]]); } }
Ah, problemet skyldes vel, at du overskriver onload-funktionen her:
<body onload="alertBox();" >
Så hvis du retter det til:
<body>
og så retter:
window.onload = function(){ var cont = document.getElementById("sponsorContainer"); var p = cont.getElementsByTagName("img"); var l = cont.getElementsByTagName("a"); alert("P: "+p.length+" - l: "+l.length); for(i=0,im=p.length;im>i;i++){ p[i].setAttribute("src",billeder[nums[i]]); l[i].setAttribute("href",lnks[nums[i]]); } }
til:
window.onload = function(){ alertBox(); var cont = document.getElementById("sponsorContainer"); var p = cont.getElementsByTagName("img"); var l = cont.getElementsByTagName("a"); for(i=0,im=p.length;im>i;i++){ p[i].setAttribute("src",billeder[nums[i]]); l[i].setAttribute("href",lnks[nums[i]]); } }
Synes godt om
Slettet bruger
23. april 2008 - 11:09#46
det er noget mærkeligt noget, når man er logget ind på siden (CMS-system), så virker de, men så snart du logger ud, så forsvinder de.
Synes godt om
Slettet bruger
23. april 2008 - 11:12#47
Men til den kode du skrev før kommer alerten med denne meddelelse: P: 6 - l: 6
Så kommer der ikke nogen alert, men billederne vises stadig kun, når man er logget ind. Og der er ikke nogen onload="alertBox();" i <body> - hvis det vises, når man ser vis kilde, så er det CMS-systemet der tilføjer den.
Og det forklarer jo så også, hvorfor det virker, når du er logget ind, men ikke når du er logget ud, hvor ovenstående indsættes.
onloaden overskriver simpelthen vores onload! Ellers skal du rykke hele JavaScript-funktionen ind i body og så rette:
window.onload = function(){ alertBox(); var cont = document.getElementById("sponsorContainer"); var p = cont.getElementsByTagName("img"); var l = cont.getElementsByTagName("a"); for(i=0,im=p.length;im>i;i++){ p[i].setAttribute("src",billeder[nums[i]]); l[i].setAttribute("href",lnks[nums[i]]); } }
til:
function appendEvent(a,b,c){if(a.attachEvent)a.attachEvent("on"+b,c);else if(a.addEventListener)a.addEventListener(b,c,false);else a["on"+b]=c} appendEvent(window,"load",function(){ var cont = document.getElementById("sponsorContainer"); var p = cont.getElementsByTagName("img"); var l = cont.getElementsByTagName("a"); for(i=0,im=p.length;im>i;i++){ p[i].setAttribute("src",billeder[nums[i]]); l[i].setAttribute("href",lnks[nums[i]]); } });
Synes godt om
Slettet bruger
23. april 2008 - 12:15#52
Jeg har lagt scriptet, så det ligger sådan her i koden nu:
unction appendEvent(a,b,c){if(a.attachEvent)a.attachEvent("on"+b,c);else if(a.addEventListener)a.addEventListener(b,c,false);else a["on"+b]=c} appendEvent(window,"load",function(){ var cont = document.getElementById("sponsorContainer"); var p = cont.getElementsByTagName("img"); var l = cont.getElementsByTagName("a"); for(i=0,im=p.length;im>i;i++){ p[i].setAttribute("src",billeder[nums[i]]); l[i].setAttribute("href",lnks[nums[i]]); } }); </script>
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.
