|
| Automatisk billedskift - Hvordan Fra : Martin Ulf Sørensen |
Dato : 17-12-06 14:10 |
|
Hej derude!
Jeg har brug for hjælp!
Jeg vil gerne ha' en stak billeder vist på min hjemmeside således
at de automatisk skifter mellem hinanden med en eller anden
overgangseffekt.
Hvordan hulen opnår jeg dette!?!? Jeg er 100% nybegynder!!!
Tak for hjælpen og ha' en rigti god jul!
Mvh.
Martin
--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials
| |
Ukendt (17-12-2006)
| Kommentar Fra : Ukendt |
Dato : 17-12-06 16:49 |
| | |
Kasper Johansen (18-12-2006)
| Kommentar Fra : Kasper Johansen |
Dato : 18-12-06 20:25 |
|
Martin Ulf Sørensen skrev:
> Hvordan hulen opnår jeg dette!?!? Jeg er 100% nybegynder!!!
Efter fem sekunder vil siden skifte. Udskift evt. selv url ved
"location.href".
<script type="text/javascript">
function DoRedirect(){
location.href = "show_billede.php?billede=billede2.jpg";
}
setTimeout("DoRedirect()", 5000);
</script>
Hvis du er 100% nybegynder, så bør du måske overveje at droppe
overgangseffekten til at starte med, da det vil kræve en del mere
avanceret kode
--
Med venlig hilsen
Kasper Johansen
| |
Martin Ulf Sørensen (19-12-2006)
| Kommentar Fra : Martin Ulf Sørensen |
Dato : 19-12-06 09:20 |
|
OK, tak for jeres indput!
Jeg har fået billedskiftet til at virke. Dog kommer billederne et
efter et, hvilket er lidt kedeligt efter min mening!
Jeg vil gerne ha' at de kommer ind og erstatter hinanden via en smart
effekt af en slags!!
Nogle gode ideer?
Mvh.
Martin
--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials
| |
Kasper Johansen (19-12-2006)
| Kommentar Fra : Kasper Johansen |
Dato : 19-12-06 11:58 |
|
Martin Ulf Sørensen skrev:
> Jeg vil gerne ha' at de kommer ind og erstatter hinanden via en smart
> effekt af en slags!!
>
> Nogle gode ideer?
Som jeg også skrev i min besked, så hvis du er 100% nybegynder, så
skulle du måske overveje at vente med dette her.
Men hvad du dog kan gøre er, at du kan preloade det næste billede, ved
at sætte en CSS-style "display" til "none". Derved vil det næste billede
blive loadet, uden at det kan ses på skærmen.
Efter 5 sekunder, så kan du ændre dets synlighed (opacity) (tag hensyn
til, om brugeren bruger IE eller FF (eller en anden browser)). Mens du
ændrer opacity, så kan du også ændre dets position (via du gør
positionen absolut i forhold til et yderligere relativt punkt, som kan
sættes på et <div>-tag) via "top" og "left" i CSS.
F.eks.
<div style="position: relative;">
<img id="tha_picture" style="display: none; position: absolute; top:
1px; left: 1px; height: 1px; width: 1px;" alt="" />
</div>
Lav så noget JavaScript, som der går ind og ændrer dets højde og bredde.
Tag evt. udgangspunkt i følgende kode:
<script type="text/javascript">
document.getElementById("tha_picture").style.height = newheight + "px";
document.getElementById("tha_picture").style.width = newwidth + "px";
</script>
Forøg højden og bredden indtil den når en ønsket størrelse. Du kan også
bruge samme måde til at øje opacity (altså synligheden) af billedet.
--
Med venlig hilsen
Kasper Johansen, knj
| |
|
|