아이디 패스워드를 치는곳에 "아이디", "패스워드" 라는 글자이미지를 배경으로 깔아주고
클릭하면 글자가 사라지는 기능이다.
▼ 소스는 이렇게 짜준다.
<input type="text" name="" id="" value="" onFocus="this.className='input_focus'" onBlur="if ( this.value == '' ) { this.className='input_blur' }" class="input_blur" />
▼ 스타일시트 정의는 아래와 같이
.input_blur {background: transparent url("../images/leftLoginBoxIDBg.gif") no-repeat;height:16px;width:450px;}
.input_focus { background: #eee ; color: #000;height:16px;width:450px;}
클릭하면 글자가 사라지는 기능이다.
▼ 소스는 이렇게 짜준다.
<input type="text" name="" id="" value="" onFocus="this.className='input_focus'" onBlur="if ( this.value == '' ) { this.className='input_blur' }" class="input_blur" />
▼ 스타일시트 정의는 아래와 같이
.input_blur {background: transparent url("../images/leftLoginBoxIDBg.gif") no-repeat;height:16px;width:450px;}
.input_focus { background: #eee ; color: #000;height:16px;width:450px;}
'IT 소프트웨어 > CSS' 카테고리의 다른 글
| IE8에서 이미지 사이의 여백 생기는 문제 (11) | 2010/01/15 |
|---|---|
| 스크롤바 관련 CSS (0) | 2009/10/20 |
| input 에 클릭하면 사라지고, out 되면 배경이미지가 나타나는 스크립트 (0) | 2009/08/12 |
| input box 클릭하면 사라지는 글자 (0) | 2009/05/19 |
| 100%의 높이를 유지하는 레이아웃 (0) | 2009/03/18 |
| 익스플로러 더블마진 해결하기 (0) | 2008/12/20 |
댓글을 달아 주세요