Toon posts:

[Formuliervelden] van kleur laten verspringen

Pagina: 1

Acties:

49 views sinds 30-01-2008
Reageer

donderdag 3 oktober 2002 14:09

Acties:

Verwijderd

Topicstarter

Fantastisch wat een ontdekking! Ik heb weleens een website gezien met daarop een formulier met gekleurde formuliervelden. Heel leuk, en je kan nu ook nog eens de kleur van het veld laten verspringen als je op het betreffende veld klikt. Als je het veld verlaat en op een ander veld klikt, krijgt het eerste veld zijn originele kleur weer terug.

Ik wil dit ook eens proberen. Ik heb nu een form gemaakt waar de velden en de borders van de velden gekleurd zijn. Alleen het van kleur verspringen lukte me niet. Wat is de truc hiervoor?

donderdag 3 oktober 2002 14:14

Acties:

cannibal

background in css ??
maar houd er rekening mee dat dit alleen de allernieuwste browsers ondersteunen en dat dit nog wel eens per browser kan verschillen

donderdag 3 oktober 2002 14:17

Acties:

Verwijderd

Topicstarter

Ja, background in de CSS. Maar dan is ie één kleur. Het gaat mij juist om het verspringen van kleur.

donderdag 3 oktober 2002 14:18

Acties:

cannibal

dat met onmouseover aanpassen. dan kleur anders instellen.

donderdag 3 oktober 2002 14:31

Acties:

Verwijderd

Topicstarter

onmouseover of onmouseclick? Hoe doe je dat dan in de css?

donderdag 3 oktober 2002 14:32

Acties:

cannibal

[code] function verander(field) { field.style.backgroundColor='#AABBEE'; }
......
<INPUT TYPE="Text" name="tekst1" style="background=#DDFFEE;" onmouseover="verander(this);">
[code]

donderdag 3 oktober 2002 14:39

Acties:

cannibal

hier nog een compleet test-html-document van mij:

code:

<HTML>
<TITLE>Focus problemen</TITLE>

<SCRIPT>
   function verander(field, kleur)
   {
      field.style.backgroundColor=kleur;
   }
</SCRIPT>

<BODY>
  <FORM name="focus" action="focus.htm" method="get">

    <INPUT TYPE="Text" name="tekst1" style="background=#DDFFEE;" onmouseover="verander(this, '#AABBFF');" onmouseout="verander(this, '#DDFFEE');">
    <BR>
    <INPUT TYPE="Text" name="tekst2">
    <BR>
    <INPUT TYPE="button" name="button1" value="button1" onclick="alert('button1')"  onmouseover="verander(this, '#AABBFF');" onmouseout="verander(this, '#DDFFEE');">
    <BR>
    <INPUT TYPE="button" name="button2" value="button2" onclick="alert('button2');submit()">
    <BR>
    <INPUT TYPE="button" name="button3" value="button3" onclick="alert('button3')">

  </FORM>
</BODY>
<HTML>

donderdag 3 oktober 2002 14:40

Acties:

Verwijderd

Topicstarter

ok, het werkt. Ik vroeg me af of ik dit kon doen als je erop klikt of met TAB in het vakje komt? Dus niet als je eroverheen hovert.

donderdag 3 oktober 2002 14:44

Acties:

cannibal

yep, gewoon gebruik maken van de andere events:
onfocus= onblur= onchange= etc.

met google zoeken naar:
ClientReferenceJS13.pdf bevat een volledige javascript beschrijving met ook het style object en alle events voor de diverse dhtml-objecten.

donderdag 3 oktober 2002 15:05

Acties:

Verwijderd

Topicstarter

onmousedown did the trick for me! Bedankt!

donderdag 3 oktober 2002 15:10

Acties:

Verwijderd

Volgens mij kun je als event ook gebruiken 'onFocus' wanneer het formfield 'actief' wordt en onBlur om hem weer terug te zetten wanneer hij weer 'inactief' wordt?

donderdag 3 oktober 2002 15:13

Acties:

Woudloper

« - _ - »

Verwijderd schreef op 03 oktober 2002 @ 15:10:
Volgens mij kun je als event ook gebruiken 'onFocus' wanneer het formfield 'actief' wordt en onBlur om hem weer terug te zetten wanneer hij weer 'inactief' wordt?

Klopt dat kan ook

Erg handig al zeg ik hetzelf... Hier hebben we het voor een interne applicatie gedaan voor een n00b gebruiker... Hebben we de boel met kleurtjes e.d. uitgelegd...

donderdag 3 oktober 2002 15:17

Acties:

Verwijderd

Topicstarter

Wacht ff, dat klinkt beter dan wat ik nu heb. Dat werkt inderdaad.

donderdag 3 oktober 2002 16:42

Acties:

Thijsmans

⭐⭐⭐⭐⭐ (5/5)

Een onMousedown wordt dacht ik niet getriggerd door een tab, of zit je tab in je muis

Privacy-adepten vinden op AVGtekst.nl de Nederlandse AVG-tekst voorzien van uitspraken en besluiten.

Pagina: 1

Reageer