포커스가있을 때 힌트를 표시하는 html 텍스트 상자

Question

포커스가있을 때 오른쪽에 힌트를 표시하는 텍스트 상자는 어떻게 만듭니 까?

예 : http://www.airbnb.com/rooms/new 은 자바 스크립트없이 수도 있습니다

Answer 1

(주소 텍스트 상자를 클릭).

---

.input + div { 
    display: none; 
    position: relative; 
    top: -30px; 
    left: 200px; 
} 

.input:focus + div { 
     display: block; 
} 

즐길 수

<input type="text" value="Focus me to see a hint!" style="width: 200px; height: 30px;"/> 
<div>Congratulations, you found me !</div> 

)

Answer 2

그 자리 표시 자와 간단

jQuery를 당신을 위해 좋은 경우, 나는이 이미 한번 여기에 대답했다 생각

<input type="text" placeholder = "your gray text" />