웹마스터 팁
page_full_width" class="col-xs-12" |cond="$__Context->page_full_width">
입력폼에 배경그림 넣기
2008.12.23 02:41
<SCRIPT language=javascript>
var c=false;
function ch (valueid) {
if(valueid == 'user_id') document.zb_login.user_id.style.backgroundImage="";
else document.zb_login.password.style.backgroundImage="";
c=true;
}
function chout (valueid) {
if(valueid == 'user_id') {
if(!document.zb_login.user_id.value) document.zb_login.user_id.style.backgroundImage="url(./image/bg_inform_id.png)";
}
else {
if(!document.zb_login.password.value) document.zb_login.password.style.backgroundImage="url(./image/bg_inform_password.png)";
}
c=true;
}
</SCRIPT>
위 자바스크립트를 링크를 걸지 마시고 직접 해당하는 파일에 삽입해주세요.
아래는 html 소스입니다.
<form action="./" method="post" onsubmit="return procFilter(this, widget_login)" id="fo_login_widget" name="zb_login">
<input type="text" name="user_id" onmousedown="return ch('user_id');" onkeydown="return ch('user_id');" style="background: url(./image/bg_inform_id.png) no-repeat;" onfocusout="return chout('user_id')" maxLength=20>
<input type="password" name="password" onmousedown="return ch('password');" onkeydown="return ch('password');" style="background: url(./image/bg_inform_password.png)) no-repeat;" onfocusout="return chout('password')" maxLength=20>
녹색은 파일경로이며, 붉은색은 폼네임입니다. 꼭 자바스크립트와 동일하게 맞춰주세요.
파란색은 아이디와 패스워드의 네임입니다. 이것도 꼭 지켜주시고요.
인풋에 스타일은 class로 하면 안되더군요. 꼭 위와 같이 직접 스타일로 적어주세요.
댓글 1
제목 | 글쓴이 | 날짜 |
---|---|---|
다른 도메인간 iframe 크기 자동조절(cross domain iframe auto resize) [2] | 서기 | 2008.04.24 |
나만의 위지윅 웹에디터 만들기 - 글 쓰기에 앞서 [4] | 예뜨락 | 2008.05.05 |
나만의 위지윅 웹에디터 만들기 - 기본 준비1 [3] | 예뜨락 | 2008.05.05 |
나만의 위지윅 웹에디터 만들기 - 기본 준비2 [2] | 예뜨락 | 2008.05.11 |
자파스크립트로 GET으로 넘어온 파라미터 가져오기 [1] | 중딩 | 2008.05.26 |
첨부파일 확장자 체크 [정규식] | arimaya | 2008.06.23 |
항상 같은곳에 있는 광고창 만들기 | ITBANK.kr | 2008.10.01 |
지정된 시간동안 강제로 보여지는 언론사에서 많이 사용하는 광고창 | ITBANK.kr | 2008.10.01 |
전체크기로 새창 열기 [1] | ITBANK.kr | 2008.10.01 |
구글 번역기 API | 유비키리 | 2008.10.29 |
입력폼에 배경그림 넣기 [1] | 정낙훈(xynex) | 2008.12.23 |
웹서핑 동작 원리의 이해 [18] | zero | 2007.10.05 |
PHP에 대한 소개 [216] | zero | 2000.03.06 |
Database, MySQL 이 무엇인가~~~ ^^ [103] | zero | 2000.03.06 |
간단한 PHP 문법 [204] | zero | 2000.03.06 |
PHP에서의 파일입출력 문법 (간단히) [92] | zero | 2000.03.06 |
MYSQL Query의 간단한 사용법 [82] | zero | 2000.03.06 |
윈도즈에서의 Apahch 설치법 [88] | zero | 2000.03.06 |
윈도즈에서 PHP3와 MySQL 설치 [40] | zero | 2000.03.06 |
MySQL RPM으로 설치하자!! (리눅스) [5] | zero | 2000.06.04 |