How to display hints in html form fields?

Question

I have a very long php form which is used to save input values entered by users. I want to show hints next to the input boxes. I know this HTML input field hint but this is not my goal, i want to show it next to the input boxes which will appear/disappear when ever user selects the respective field. (i want this in html not in javascript etc because i do not know JavaScript.)

Java an Javascript are 2 totally different languages. Besides you can't change your HTML to show/hide something without Javascript. — Niels, Jan 29 '13 at 18:36

score 17 · Accepted Answer · answered Jan 29 '13 at 18:41

17

You should use HTML5 and use textfields like

<input type="text" placeholder="enter input" title="Enter input here">

answered Jan 29 '13 at 18:41

nsthethunderbolt

2,059
1
17
24

1

OP wants it next to the input – Ruan Mendes Jan 29 '13 at 18:48

score 9 · Answer 2 · answered Jan 29 '13 at 18:38

9

You can do it with the :focus CSS pseudo-class. Put a span next to the input box and give it this style:

.hint { display: none; }
input:focus + .hint { display: inline; }

JSBin: http://jsbin.com/inilot/1/edit

answered Jan 29 '13 at 18:38

Tom Smilack

2,057
15
20

score 7 · Answer 3 · answered Jan 29 '13 at 18:37

7

You can use title argument like this :

<input title="hint" ... />

answered Jan 29 '13 at 18:37

TN888

7,659
9
48
84

1

`title` works in other html tags too, e.g. `` – Skyfish Mar 12 '21 at 14:50

score 5 · Answer 4 · answered Jan 29 '13 at 18:46

5

This is a CSS technique without using any Java{script} code:

<style>
.ami div {display:none}
.ami:hover div {display:block}
</style>
<a class=ami href="#">Please hover me <div>I show only when you over</div></a>
</html>

Hope I Help

answered Jan 29 '13 at 18:46

Aminadav Glickshtein

23,232
12
77
117

How to display hints in html form fields?

4 Answers4