Avatar billede zipper20 Nybegynder
05. januar 2004 - 17:26 Der er 21 kommentarer og
1 løsning

HoverBGCOLOR på textfield's.

Jeg fandt et link herinde en gang hvor man så hvordan man lavede en effekt på textfields osv. svarende til a.link og a.hover... hvor er det ??? Eller hvordan gør man ?
Avatar billede thesurfer Nybegynder
05. januar 2004 - 17:41 #1
Noget i stil med?:
<input type="text" onMouseOver="this.style.background='#FF0000';" onMouseOut="this.style.background='#FFFFFF';">
Avatar billede zipper20 Nybegynder
05. januar 2004 - 17:43 #2
Ja, men kan man ikke gøre det med CSS??
Avatar billede skovenborg Nybegynder
05. januar 2004 - 17:50 #3
Jo du kan i Mozilla:

input:hover {background:#f00}
Avatar billede zipper20 Nybegynder
05. januar 2004 - 17:51 #4
Oki... og det andet virker i alt (just about) ??
Avatar billede skovenborg Nybegynder
05. januar 2004 - 17:51 #5
og hvis det kun skal være text-fields:
input[type="text"]:hover {background:#f00}

men IE CSS understøttelse rækker desværre ikke så langt :(
Avatar billede exp Juniormester
05. januar 2004 - 17:52 #6
skovenborg >>
No wonder... ;-)
Avatar billede skovenborg Nybegynder
05. januar 2004 - 17:53 #7
javascript virker i alle browsere der understøtter javascript (og hvor brugeren ikke har slået det fra) - og samtidig skal den være så ny at den understøtter den såkaldte Document Object Model (DOM). Men de fleste burde kunne det - og hvis ikke er det vel ingen større katastrofe ;-)
Avatar billede zipper20 Nybegynder
05. januar 2004 - 17:53 #8
Oki then... last Q.
Hvordan laver jeg så border="1" så det bliver efter man har peget på txtfeltet ?
Avatar billede zipper20 Nybegynder
05. januar 2004 - 17:53 #9
Næeh... ikke nogen katastrofe... vil bare gerne have det med ;-)
Avatar billede thesurfer Nybegynder
05. januar 2004 - 17:55 #10
Du kan bruger:

<style type="text/css">
input:hover {background:#f00}
.over {
    background: #FF0000;
    }
.out {
    background: #FFFFFF;
    }
</style>

<input type="text" onMouseOver="this.className='over';"  onMouseOut="this.className='out';">

Så kan du smide alle dine style dimser i .over og .out..
Avatar billede skovenborg Nybegynder
05. januar 2004 - 17:57 #11
og så med border:
<style type="text/css">
input[type="text"]:hover {background:#f00}
.over {
    background: #FF0000;
border:1px solid #000;
    }
.out {
    background: #FFFFFF;
border:0px;
    }
</style>
Avatar billede zipper20 Nybegynder
05. januar 2004 - 17:58 #12
Der er ingen border efter mouseout
Avatar billede thesurfer Nybegynder
05. januar 2004 - 17:59 #13
hvis der skal være border ved mouseout, erstatter du border:0px; med border:1px solid #000;
Avatar billede thesurfer Nybegynder
05. januar 2004 - 18:01 #14
Hvis der skal være en border fra starten af, skal den se sådan ud:

<style type="text/css">
input[type="text"]:hover {background:#f00}
.over {
    background: #FF0000;
border:1px solid #000;
    }
.out {
    background: #FFFFFF;
border:1px solid #000;
    }
</style>

<input type="text" style="border:1px solid #000;" onMouseOver="this.className='over';"  onMouseOut="this.className='out';">
Avatar billede zipper20 Nybegynder
05. januar 2004 - 18:01 #15
Nåeh ja ... *GG*

Men der er ikke border ved starten...
Avatar billede zipper20 Nybegynder
05. januar 2004 - 18:02 #16
Perfekt...
Smid lige et svar
Avatar billede thesurfer Nybegynder
05. januar 2004 - 18:05 #17
Et svar er smidt :)
Avatar billede thesurfer Nybegynder
05. januar 2004 - 18:09 #18
zipper20> Takker for points! :)

skovenborg> Hvis du vil ha' en bid af kagen, må du lige sige til :)
Avatar billede skovenborg Nybegynder
05. januar 2004 - 18:09 #19
nåå, troede det var meningen border'en kun skulle komme når musen blev flyttet  over ;-)
Avatar billede zipper20 Nybegynder
05. januar 2004 - 18:09 #20
skov -> Ja... do so ;-)
Avatar billede skovenborg Nybegynder
05. januar 2004 - 18:10 #21
det vist lige meget ;-)
Avatar billede roenving Novice
05. januar 2004 - 18:19 #22
-- og så lige en kommentar til klasseskift, som er enormt uøkonomisk, da browseren skal genberegne sit css DOM-træ !-)
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