e-gradiva | HTML | CSS | JavaScript | Načrtovanje | |||||
SERŠ Maribor | Iskanje | Primeri |
Koda: | <script type="text/javascript"> polozaj=0 function premakni() { document.getElementById("slika").style.position="relative" polozaj = polozaj + 50 najvec=document.body.clientWidth/2 if (polozaj>najvec) polozaj=0 document.getElementById("slika").style.left=polozaj } </script> <p>Klikaj na sliko!</p> <img id="slika" src="slike/xfoto0.jpg" alt="Klikaj!!" onclick="premakni()" /> |
---|---|
Izgled v brskalniku: |
Klikaj na sliko! |
Razlaga: |
Slika ima nastavimo pozicijo slike na relativno glede na pozicijo na strani. Po kliku na sliko se položaj, v slogovni predlogi CSS vrednost left , poveča za 50 pikslov. S spremenljivko najvec je določena meja, do katere se lahko premika slika. Če je pozicija slike večja od te največje določene, se resetira na 0, torej spet postavi se v začetno stanje.
|
SERŠ Maribor : Strokovna gimnazija : 2004 : Benjamin Šaler