Rollover images

[oleisbest]

Hvordan lager man egentlig rollover images oppå andre bilder på websider?

 

Noe ala dette

 

Kan dette løses på andre måter en script?

[PoleCat]

Kommer ikke på andre metoder enn javascript, selv om du seffers kan gjøre dette med flash. Hvorfor ikke script?

Her vil du vertfall finne et slikt script; javascript.internet.com

[Bluebeans]

Dreamweaver har innebygd funksjon for dette. Den koden som den generer er litt vanskelig og redigere.

[dms]

Jeg bruker kun CSS til dette på min side, sjekk ut koden..

[oleisbest]

Ok men ikke helt sånn jeg tenkte på dms, Skal ha rollover effekt når jeg allerede har et bilde i bakgrunnen.

 

Går det ann å bruke Slice Tool i Adobe til det her. Jeg har laget en header som jeg igjen har lagt noen bilder over som jeg vil skal forandre seg når musepekeren føres over. F.eks et home icon som blir mørkere når brukeren fører over pekeren. Går det eller er jeg helt på villspor?

[pekle]

<img src="img1.png" alt="bilde" onmouseover="this.src='img2.png'" onmouseout="this.src='img1.png'">

[dms]

<img src="img1.png" alt="bilde" onmouseover="this.src='img2.png'" onmouseout="this.src='img1.png'">

...som gjør akkurat det samme som css-utgaven. Bruker du de små grå litt får du til det du vil med de metodene du har fått nå

[dms]

Og bare som en liten demo på at effekten fra khporz.de er mulig å implementere med CSS:

http://www.tegneblokken.net/csshover/css.html

[oleisbest]

Ok men da prøver jeg det, sitter å ser på css koden din nå

[dms]

Oops, forhastet meg litt. Sjekk koden om et kvarters tid, Mozilla var ikke helt happy med å droppe <div> og kun bruke <a>.

Edit: Funker fint i Mozilla nå, vet ikke helt hva som gjorde utslaget men det kan ha vært å gjøre om fra "class" til "id". Weird..