tekst mouseover

[jappertjeh]

Ik heb overal scriptjes gezocht, maar of te moeilijk of niet werkend of doen niet wat ik wil.
Ik heb al een mouseover gemaakt met 2 afbeeldingen en een link, maar nu wil wat anders, namelijk:

ZON

Als ik hier met mijn muis op wijs komt er een plaatje van de zon. Verder is dit geen link en als je je muis ervan verwijdert is het plaatje weg! Zeg maar als voorbeeld van wat een zon is in dit voorbeeld. Is dat zo veel moeilijker dan een mouseover van 2 plaatjes met link?

Alvast bedankt
Jasper

 

[Naarling]

Is vrij makkelijk.
DIt is de benodigde CSS.

mouseover img{
        display:none;
        position:absolute;
}
.mouseover:hover img{
    display:inline;
}

en dit is de HTML.

    <div class="mouseover">
zon <img src="urlvaneenplaatje" alt="plaatje van de zon">    
    </div>

Al weet ik niet zeker of het ook in IE werkt, dat programma heeft de nare neiging om de standaarden niet, of niet volledig na te leven. Zeker de oudere versies.

 

[jappertjeh]

Dit werkt bij niet in Google Chrome en ook niet in live view van Dreamweaver. Ik krijg gewoon het plaatje achter de tekst gelijk te staan(dus de div mouseover werkt niet).

 

[Naarling]

Dit werkt bij niet in Google Chrome en ook niet in live view van Dreamweaver. Ik krijg gewoon het plaatje achter de tekst gelijk te staan(dus de div mouseover werkt niet).

Tikfoutje van mijn kant.
Probeer het eens met

div.mouseover img{
        display:none;
        position:absolute;
}
div.mouseover:hover img{
    display:inline;
}

(zonder div werkt het in FF niet)

 

[jappertjeh]

jep, doet het. Helemaal goed, thanks!

 

[Naarling]

Mooi zo!