답변 3개 / 댓글 2개
채택된 답변
+20 포인트
2014-09-09 (화) 12:01:48
그누5 기본 outlogin 스킨의 비밀번호 가로폭 104px은 css에서 주어지는것이 아니라
스크립트에서 부여합니다.
로그인스킨 파일을 여시고 하단에 보시면 <script>가 있을겁니다.
Copy
$omi = $('#ol_id');$omp = $('#ol_pw');$omp.css('display','inline-block').css('width',104);$omi_label = $('#ol_idlabel');$omi_label.addClass('ol_idlabel');$omp_label = $('#ol_pwlabel');$omp_label.addClass('ol_pwlabel'); $(function() { $omi.focus(function() { $omi_label.css('visibility','hidden'); }); $omp.focus(function() { $omp_label.css('visibility','hidden'); }); $omi.blur(function() { $this = $(this); if($this.attr('id') == "ol_id" && $this.attr('value') == "") $omi_label.css('visibility','visible'); }); $omp.blur(function() { $this = $(this); if($this.attr('id') == "ol_pw" && $this.attr('value') == "") $omp_label.css('visibility','visible'); }); $("#auto_login").click(function(){ if ($(this).is(":checked")) { if(!confirm("자동로그인을 사용하시면 다음부터 회원아이디와 비밀번호를 입력하실 필요가 없습니다.\n\n공공장소에서는 개인정보가 유출될 수 있으니 사용을 자제하여 주십시오.\n\n자동로그인을 사용하시겠습니까?")) return false; } });}); function fhead_submit(f){ return true;}
위 소스에서
Copy
$omp.css('display','inline-block').css('width',104); // 위부분을$omp.css('display','inline-block');//이렇게 바꿔주세요
그럼 현재 설정해둔 200px이 먹히실겁니다.
그리고 코드입력 label 은
css 값을 주셔야합니다.
좀 번거로운 방법이지만, 아래소스를 css 파일에 넣으세요
#ol_colabel{
- position: absolute;
- top: 72px;
- left: 5px;
}
그렇게하시면 원하시는 값이 나올겁니다.
haswell
2014-09-05 (금) 02:23:10
감사합니다ㅜㅜ
Copy
<!-- 로그인 전 아웃로그인 시작 { --><section id="ol_before" class="ol"> <h2>회원로그인</h2> <form name="foutlogin" action="<?php echo $outlogin_action_url ?>" onsubmit="return fhead_submit(this); " method="post" autocomplete="off"> <fieldset> <input type="hidden" name="url" value="<?php echo $outlogin_url ?>"> <label for="ol_id" id="ol_idlabel">아이디<strong class="sound_only">필수</strong></label> <input type="text" id="ol_id" name="mb_id" required class="required" maxlength="20"> <label for="ol_pw" id="ol_pwlabel">비밀번호<strong class="sound_only">필수</strong></label> <input type="password" name="mb_password" id="ol_pw" required class="required" maxlength="20"> <label for="ol_code" id="ol_colabel">코드입력<strong class="sound_only">필수</strong></label> <input type="password" name="mb_code" id="ol_code" required class="required" maxlength="4"> <input type="submit" id="ol_submit" value="로그인"> </fieldset> </form></section>
PHP
Copy
/* 아웃로그인 스킨 */.ol {position:relative;padding:15px 15px 14px 14px}.ol h2 {margin:0;padding:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden}.ol ul {margin:0;padding:0;list-style:none} .ol a.btn_admin {display:inline-block;padding:0 10px;height:23px;border:1px solid #e8180c;background:#e8180c;color:#fff;text-decoration:none;line-height:2.15em;vertical-align:middle} /* 관리자 전용 버튼 */.ol a.btn_admin:focus, .ol a.btn_admin:hover {text-decoration:none} #ol_before {float:right;margin:150px 150px 0 150px;}#ol_before fieldset {position:relative}#ol_id {display:block;margin:0 0 5px !important;margin:0 0 3px;padding:0 5px;width:200px;height:25px;border:1px solid #e4eaec;background:#f7f7f7;line-height:1.6em}.ol_idlabel {position:absolute;top:6px;left:5px;color:#333;font-size:0.95em}#ol_pw {display:block;margin:0 0 5px !important;margin:0 0 3px;padding:0 5px;width:200px;height:25px;border:1px solid #e4eaec;background:#f7f7f7;line-height:1.6em}.ol_pwlabel {position:absolute;top:35px;left:5px;color:#333;font-size:0.95em} #ol_code {margin:0 0 5px !important;margin:0 0 3px;padding:0 5px;width:120px;height:25px;border:1px solid #e4eaec;background:#f7f7f7;vertical-align:top;line-height:1.6em}.ol_colabel {position:absolute;top:55px;left:5px;color:#333;font-size:0.95em} #ol_submit {margin-left:15px;width:60px;height:24px;border:0;background:#333;color:#fff;font-size:0.9em;font-weight:bold;vertical-align:top}#ol_before a {letter-spacing:-0.15em}
CSS
답변에 대한 댓글 1개
2014-09-05 (금) 02:37:12
2014-09-05 (금) 02:11:25
코드를 보여주실때 이미지로 올리지 마시고
Copy
감싸서 올려보세요.소스코드
제가 한번 봐드릴께요
답변에 대한 댓글 1개
답변을 작성하려면 로그인이 필요합니다.
개발중인 url 주소 좀 부탁드려요.