Avatar billede simono Nybegynder
20. januar 2005 - 09:56 Der er 15 kommentarer

Hvordan skifter man billede ved hover?

Jeg vil bruge et billede som link og at det ændres til et andet billede ved hover. Kan jeg gøre det i css og hvordan?
Avatar billede morteeart Nybegynder
20. januar 2005 - 10:05 #1
Ja, du kan i CSS men stakkels internet explorer kan ikke forstå det så du er nød til at bruge javascript.
Avatar billede morteeart Nybegynder
20. januar 2005 - 10:06 #2
Avatar billede tjensen Nybegynder
20. januar 2005 - 10:11 #3
Det burde ikke være nødvendig at ty til javascript for det. Parameteren onmouseover´burde kunne gøre det. Er desværre på arbejde nu, så har ikke tid til at give et eksempel, men i eftermiddag ved 15-17 tiden kan jeg godt ordne et.
Ellers søg her på eksperten efter onmouseover, skal nok give noget.
Avatar billede tjensen Nybegynder
20. januar 2005 - 10:22 #4
Se evt http://eksperten.dk/spm/482124

Læs indlæg fra Skovenborg klokken 14:56

//Tjensen
Avatar billede morteeart Nybegynder
20. januar 2005 - 11:31 #5
tjensen, onmouseover ER javascript !-)
Avatar billede simono Nybegynder
20. januar 2005 - 12:30 #6
Jeg har nu lavet det med javascript....

Tjensen - hvis det ikke er javascript onmouseover du mener, må du meget gerne lave et eksempel....
Avatar billede morteeart Nybegynder
20. januar 2005 - 12:32 #7
Men hvis du gerne vil lave det uden javascript, og skide på IE (som vi andre gør)
så læs om SELECTOR og CHILD elementerne i css.
Avatar billede roenving Novice
20. januar 2005 - 13:10 #8
Med javascript i onmouseover/out:

<img src="noget.gif" onmouseover="this.src='noget_over.gif'" onmouseout="this.src='noget.gif'">
Avatar billede knudgert Nybegynder
20. januar 2005 - 13:12 #9
Man kunne jo sætte billedet som baggrundsbillede, så vil IE også forstå det med a:hover.
Avatar billede morteeart Nybegynder
20. januar 2005 - 13:33 #10
tjoo, med display: block; på a {} elementet :)
Avatar billede tjensen Nybegynder
20. januar 2005 - 15:55 #11
Hehe, ja ommouseover er et javascript.. Men det er nok en af de mest integrede scripcts. Det mit hovede var ude i, var at skrive et nyt script.
Avatar billede knudgert Nybegynder
20. januar 2005 - 16:27 #12
>morteeart
Ikke nødvendigvis med display: block (selvom det sagtens kan bruges), man kan også bruge nogle &nbsp; med tilpas stor font-size og antal som passer til billedets størrelse.
Avatar billede olebole Juniormester
20. januar 2005 - 20:02 #13
<ole>

Med en smule fantasi, *kan* man nu godt bruge ren CSS:

<style type="text/css">
.picHolder {
    position: relative;
}
a#bla {
    position: absolute;
    width: 50px;
    height: 50px;
    background: url(pic1.gif);
}
a#bla:hover {
    background: url(pic2.gif);
}
</style>

<div class="picHolder">
    <a id="bla" href="#">&nbsp;</a>
</div>

- ikke at det er 'den phede løsning', men det *kan* gøres  :)

/mvh
</bole>
Avatar billede knudgert Nybegynder
20. januar 2005 - 20:53 #14
Det er ikke tilladt at sætte height og width på et inlinelement (a), eller ?
Avatar billede olebole Juniormester
20. januar 2005 - 21:59 #15
knudgert >> Nej, ikke hvis elementet ikke er positioneret ... men det er det her  :)
Avatar billede Ny bruger Nybegynder

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.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester