HTML-Formular: Text bei Klick auf Textfeld

1

<input ...><span class="help">bla</span>

1

.help {

2

  display: none;

3

}

4

5

input:focus + .help {

6

  display: block;

7

}

ungetestet, nur eine idee

Daniel F. schrieb:
> ungetestet, nur eine idee
Schon ein guter (funktionierender) Ansatz, vielen Dank! Fehlt nur die 
Funktion, den Text immer an der gleichen Stelle zu platzieren. Da werde 
ich mal rumgooglen.

Gruß
Dennis

Dennis S. schrieb:
> den Text immer an der gleichen Stelle zu platzieren.

dreckige lösung: mit css (position: absolute) verschieben ;-)

Daniel F. schrieb:
> dreckige lösung: mit css (position: absolute) verschieben ;-)
Jaaa... ich hatte gehofft mir die Hände nicht SO dreckig machen zu 
müssen! ;-)

martin schrieb:
> Wie wäre es mit Placeholdern in den Eingabefeldern?
>
> Beispiel: https://jsfiddle.net/6r6drn26/

Da habe ich drüber nachgedacht. Leider beißt sich das dann (afaik) mit 
eventuell bereits vorhandenen Standard-Werten die bereits eingegeben 
sind.

martin schrieb:
> Habe etwas weitergebastelt:
> https://jsfiddle.net/5m35pba2/3/

Richtig gut, vielen Dank! :-)

Ich nehme mal an das Ganze beim Reinklicken zu realisieren ist nicht so 
einfach? Man müsste dann ja auch definieren, wann der Text wieder 
verschwinden soll...

Alexander J. schrieb:
> Dennis S. schrieb:
>> Daniel F. schrieb:
>>> dreckige lösung: mit css (position: absolute) verschieben ;-)
>> Jaaa... ich hatte gehofft mir die Hände nicht SO dreckig machen zu
>> müssen! ;-)
>
> Nö, mit CCS geht sowas ganz elegant. Javascript passt dort ind Q&D.

CCS? Oder CSS?
Der zweite Satz ist mir völlig schleierhaft ehrlich gesagt...

Dennis S. schrieb:
> martin schrieb:
>> Habe etwas weitergebastelt:
>> https://jsfiddle.net/5m35pba2/3/
>
> Richtig gut, vielen Dank! :-)
>
> Ich nehme mal an das Ganze beim Reinklicken zu realisieren ist nicht so
> einfach?

ersetze :hover durch :focus, dann klappt das auch wenn man die Maus 
nicht nutzt :)

Ich bin begeistert! Vielen Dank an alle.

Gruß