Avatar billede leif Seniormester
15. maj 2006 - 22:02 Der er 14 kommentarer og
1 løsning

Opdatere CSS on the fly

Hej,

Lad os sige jeg har et felt som indeholder samme værdi som min baggrundsfarve, kan jeg så hvis jeg ændrer farvekoden, få den til at ændre den i min CSS så jeg får en total idé om hvordan det ser ud inden jeg gemmer ?

På forhånd tak.

/Leif
Avatar billede jensgram Nybegynder
15. maj 2006 - 22:12 #1
<input type="text" value="ff0000" onchange="document.body.style.backgroundColor = '#' + this.value;">

... måske!
Avatar billede leif Seniormester
15. maj 2006 - 22:29 #2
Hmm, synes ikke at virke
Avatar billede jensgram Nybegynder
15. maj 2006 - 22:44 #3
Nej, det var også bare et utestet bud.
Avatar billede thesurfer Nybegynder
15. maj 2006 - 23:07 #4
Nok noget i stil med:
<input type="text" value="ff0000" onchange="document.body.style='background-color:#' + this.value;">
Avatar billede thesurfer Nybegynder
15. maj 2006 - 23:11 #5
Jeg har lavet det om til "onkeyup":

<input type="text" value="ff0000" onkeyup="document.body.style='background-color:#' + this.value;">
Avatar billede olebole Juniormester
15. maj 2006 - 23:32 #6
<ole>

- eller måske:
    <input type="text" value="ff0000" onkeyup="if(this.value.length==6)document.body.style='background-color:#' + this.value;">

/mvh
</bole>
Avatar billede thesurfer Nybegynder
15. maj 2006 - 23:33 #7
olebole> "#fff" er vel også gyldig..?
Avatar billede olebole Juniormester
15. maj 2006 - 23:43 #8
yups - men det er noget rod at se på '#f', '#ff', '#ffff' og '#ffffff'  :)

Et kompromis kunne være:
    <input type="text" value="ff0000" onkeyup="vL=this.value.length;if(vL==3||vL==6)document.body.style='background-color:#' + this.value;">
Avatar billede mclemens Nybegynder
16. maj 2006 - 23:49 #9
p.s.:
<input type="text" value="ff0000" onkeyup="vL=this.value.length;if(vL==3||vL==6)document.body.style.backgroundColor='#' + this.value;">
Avatar billede mclemens Nybegynder
17. maj 2006 - 00:22 #10
p.p.s.: jensgram's første eksempel virkede dog også ...
- man skulle bare indtaste enten 3 || 6 tegn og klikke uden til input'et ...

- den er så udvidet med onkeyup af thesurfer
- og længde kontrol af olebole

- og blevet returneret til den fungerende object tilknytningen som jensgram også brugte ... ville nok selv nøjes med ... document.body.style.background= ... - men det er jo en smagssag :)
Avatar billede mclemens Nybegynder
17. maj 2006 - 00:23 #11
tilknytningen -> tilknytning
Avatar billede leif Seniormester
18. juni 2006 - 18:50 #12
Har ikke lige fået kigget mere på det, da en anden opgave pressede sig på. Smid et svar hvis du ønsker point.
Avatar billede mclemens Nybegynder
18. juni 2006 - 19:23 #13
Tjah jensgram første virkede, hvis man sørgede for at
antallet passede ,inden man clickede uden til elementet.

- Thesurfers onkeyup var lidt smartere dog blev backgroundColor
rettet til background-color, så scriptet ikke længere virkede.

- Olebole udvidede så den sidste, der ikke virkede til validering på antal
tegn, dog virkede den stadig ikke p.gr.a. background-color og et manglende '

... Jeg samlede blot trådene ingen point til mig, men det ligner næsten en splitter mellem alle tre, da de hver især har bidraget til løsningen - men det er jo din beslutning og ikke min ;o)
Avatar billede thesurfer Nybegynder
18. juni 2006 - 21:58 #14
Ingen points til mig, tak.
Avatar billede leif Seniormester
25. juli 2006 - 23:15 #15
Lukker
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