08. marts 2006 - 11:19Der er
9 kommentarer og 1 løsning
skiftende baggrund i tabel
Jeg har lavet mig en side hvor et billede skifter i en tabel celle. Det virker fint. Problemet er, at jeg vil have billedet til at være baggrund og ikke et billede indsat på siden.
Er der nogen der gider hjælpe mig?
Se eventuelt projektet på southpawsite.com (der er ikke så meget endnu ;-)
dele af kildekode:
i head:
<script type="text/javascript">
<!-- // JavaScript to interpolate random images into a page. var ic = 12; // Number of alternative images var xoxo = new Array(ic); // Array to hold filenames
function pickRandom(range) { if (Math.random) return Math.round(Math.random() * (range-1)); else { var now = new Date(); return (now.getTime() / 1000) % range; } } // Write out an IMG tag, using a randomly-chosen image name. var choice = pickRandom(ic); // --> </script>
<script type="text/javascript"> <!-- // JavaScript to interpolate random images into a page. var ic = 12; // Number of alternative images var xoxo = new Array(ic); // Array to hold filenames
function pickRandom(range) { if (Math.random) return Math.round(Math.random() * (range-1)); else { var now = new Date(); return (now.getTime() / 1000) % range; } }
// Write out an IMG tag, using a randomly-chosen image name. var choice = pickRandom(ic);
window.onload = function() { var tbl = document.getElementById("tbl1"); if(tbl) { tbl.style.backgroundImage = "url(" + xoxo[choice] + ")"; // hvis billedet ikke skal gentages i baggrunden... tbl.style.backgroundRepeat = "no-repeat"; } } // --> </script>
Hvis dine filnavne er så regelrette som dem du har illustreret her, kan du i princippet undlade at definere et array til dem og bare lægge stien ind i onload-funktionen. Således:
<script type="text/javascript"> <!-- // JavaScript to interpolate random images into a page. var ic = 12; // Number of alternative images
function pickRandom(range) { if (Math.random) return Math.round(Math.random() * (range-1)); else { var now = new Date(); return (now.getTime() / 1000) % range; } }
// Write out an IMG tag, using a randomly-chosen image name. var choice = pickRandom(ic) + 1;
window.onload = function() { var tbl = document.getElementById("tbl1"); if(tbl) { tbl.style.backgroundImage = "url(/img/random/00" + choice + ".jpg)"; // hvis billedet ikke skal gentages i baggrunden... tbl.style.backgroundRepeat = "no-repeat"; } } // --> </script>
Hvor meget ændring skulle der til for at gøre det til et regulært galleri? Måske med en funktion der gøre at den skifter billede måske hvert 3. sek og en funktion der giver brugeren mulighed for at selv klikke frem og tilbage? Og så med links der hedder slideshow on/off...
Jeg opretter selvfølgelig nyt spørgsmål med nye point ;-)
Tjaa, det er jo en lidt anden opgave end denne her, da brugerens ønsker skal serviceres (og når de bliver blandet ind i sagen bliver den straks mere kompleks :)). Det er absolut ikke umuligt, men der er bare noget tilstandshåndtering som du ikke har i den nuværende version.
Jeg har desværre ikke lige noget funktionel kode ved hånden, men mon ikke 5 minutter på Google kan give dig det du søger...
Synes godt om
Ny brugerNybegynder
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.