묻고답하기
로그인폼 위에 미리 글자떠있게..
2014.02.10 20:07
안녕하세요 로그인폼 위에 글자를 미리 떠있게 보여주고 싶어요 ..네이버에서 아무리 뒤져봐도 잘 안나오네요..
현재 다운로드 게시판 neutral 로그인 위젯을 사용중이구요.
현재 로그인폼 html입니다
<load target="css/form.css" />
<div class="n-login">
<form action="./" method="post" class="show" ruleset="@login">
<fieldset>
<legend class="none">XE Login</legend>
<input type="hidden" name="act" value="procMemberLogin" />
<input type="hidden" name="success_return_url" value="{getRequestUriByServerEnviroment()}" />
<dl>
<dd><input name="user_id" type="text" id="n-uid" class="inputText" value="User_id" /></dd>
<dd><input name="password" type="password" id="n-upw" class="inputText" value="password" /></dd>
</dl>
<span class="submit">
<span class="keep">
<input name="keep_signed" type="checkbox" id="n-keep" value="Y" /> <label for="n-keep">{$lang->keep_signed}</label>
</span>
<input type="submit" class="s" value="{$lang->cmd_login}" />
</span>
<span class="caution">{str_replace('\\n','<br />',$lang->about_keep_signed)}</span>
</fieldset>
</form>
<ul class="help">
<li><a href="{getUrl('act','dispMemberSignUpForm')}">{$lang->cmd_signup}</a></li>
<li><a href="{getUrl('act','dispMemberFindAccount')}">{$lang->cmd_find_member_account}</a></li>
<li><a href="{getUrl('act','dispMemberResendAuthMail')}">{$lang->cmd_resend_auth_mail}</a></li>
</ul>
</div>
<script type="text/javascript">
jQuery("#n-uid").focus();
jQuery("#n-keep").click(function(){
if( this.checked ) jQuery(".n-login .caution").css("display", "block");
else jQuery(".n-login .caution").css("display", "none");
});
</script>
요렇게 되어있어요 . 네이버에서 뒤지다가 value 부분을 추가한다면 된다고해서 해봤더니 .. 일일히 삭제시켜줘야하더라구요.
마우스를 클릭하는순간 원래 떠있던 글을 없애고 싶은데 많이 어려운건가요?
송동우님께서 쓰신 댓글을 보았는데 .. 어디부분을 수정해줘야할지 모르겠어서 ... 위젯페이지에 위젯으로 로그인폼을
넣어놨어요..
댓글 7
-
CTN
2014.02.11 00:34
-
우니즈
2014.02.11 16:42
댓글 감사합니다 .^^ 위와 같은방법으로 해놨더니 글자를 지워야하네요 ㅠㅠ
-
YJSoft
2014.02.11 01:21
<input type="text" value="사라질 글자" onfocus="if(!this._haschanged){this.value=''};this._haschanged=true;">
이런 방법으로 해주셔야 첫번째 클릭시에만 글자가 사라집니다.
-
CTN
2014.02.11 02:21
예. 몰랐던 내용인데 감사합니다.
-
우니즈
2014.02.11 16:43
방금 이방법으로테스트해봤는데 .. 네모칸박스가 없어지네요.. 따로설정을 잡아줘야하는건가요 ?위와 같은내용으로해서 수정해야될 부분만 바꿨더니 네모박스가 작아지면서 테두리가 사라지네요..ㅠㅠ
-
심플XE
2014.02.11 18:28
onfocus말고 onclick을 써보심이..
-
이즈야
2014.02.11 21:54
<input ... placeholder="이곳에 미리 입력될 내용을 넣어주세요." />
placeholder 기능은 HTML5에서 추가된 신기능입니다. HTML5를 지원하지 않는 브라우저에서 사용하기 위해서는 첨부된 jQuery 라이브러리를 사용할 필요가 있습니다.
사용법은 아래와 같습니다.
if (jQuery.fn.placeholder) { jQuery("input[placeholder], textarea[placeholder]").placeholder(); }
value값이 포커스 상태에서는 없도록 하면 될거예요.
해당 input 태그 안에
value="포커스되면글자는사라져주세요" onfocus="this.value=''"