스클롤 위치에 따라 다라다니기 어떻게하면 될까요!? 부탁드립니다.

스클롤 위치에 따라 다라다니기 어떻게하면 될까요!? 부탁드립니다.

QA

스클롤 위치에 따라 다라다니기 어떻게하면 될까요!? 부탁드립니다.

답변 2

본문

상담신청 하단에 있는 바가 스크룰 위치에 따라 하단에 계속해서 따라다니게 하고 싶습니다. 

 

알아봐도 잘 안되네요. 꼭즘 작동될 수 있도록 부탁드립니다. 

 

tail.php

↓이부분을 어떻게하면 되나요? 

 

<div class="footer_counsel clearfix">
    <div class="inner">
        <h2><img src="<?=G5_THEME_URL?>/img/q_counsel_tit.png" alt=""></h2>
        <div class="box">
        
        
            <form id="footer_counsel_form" name="footer_counsel_form" action="<?=G5_THEME_URL?>/tl_counsel/apply_x.php" method="post">
            <input type="hidden" name="ci_id" value="3">
                <fieldset>
                    <legend class="sr_only">빠른상담</legend>
                    <div class="box1">
                        <p class="frow">
                            <label for="co_name">이름</label>
                            <input type="text" name="co_name"  id="co_name" class="form_txt">
                        </p>
                        <div class="frow">
                            <input type="hidden" id="co_hp" name="co_hp" />
                            <label for="co_hp2">전화번호</label>
                            <div class="tel_box">
                                <select id="co_hp1" maxlength="4" class="phone" groupname="txtNum"  requird="">
                                    <option value="010">010</option>
                                    <option value="011">011</option>
                                    <option value="016">016</option>
                                    <option value="017">017</option>
                                    <option value="018">018</option>
                                    <option value="019">019</option>
                                </select>
                                <input type="text" id="co_hp2" maxlength="4" class="phone" groupname="txtNum"  requird="">
                                <input type="text" id="co_hp3" maxlength="4" class="phone" groupname="txtNum"  requird="">
                            </div>
                        </div>
                    </div>
                    <div class="box2">
                        <p class="frow">
                            <label for="co_text_1">내용</label>
                            <textarea id="co_text_1" required="" name="co_text_1"></textarea>
                        </p>
                    </div>
                    <div class="box3">
                        <div class="privacy">
        <input type="checkbox" name="counsel_agree" id="counsel_agree" value="yes" class="checkbox" checked="">
          개인정보 취급방침 동의 </div>
                        <input type="submit" value="신청하기" class="btn_submit">
                    </div>
                </fieldset>
            </form>
        </div>
    </div>
</div>

 

 

<CSS 코드>

 

.footer_counsel {padding:42px 0; background:#f7d654;}
.footer_counsel h2 {float:left; width:188px;}
.footer_counsel label {width:90px; display:inline-block; font-size:22px; color:#000000; line-height:46px;}
.footer_counsel input[type="text"], .footer_counsel select { height:50px; padding:0 10px; font-size:22px; color:#1e353c; border:0; width:100% }
.footer_counsel .box { margin-bottom:-10px; vertical-align:top;}
.footer_counsel .box1 {float:left; width:40%; padding:0 32px;}
.footer_counsel .box1 label {width:90px;}
.footer_counsel .tel_box { width:100%; overflow:hidden; display:inline-block; vertical-align:middle;}
.footer_counsel .tel_box input[type="text"], .footer_counsel .tel_box select {float:left; width:32%; }
.footer_counsel .tel_box input[type="text"] {margin-left:2%;}
.footer_counsel .box2 {float:left; width:34%;}
.footer_counsel .box2 label {width:50px;  vertical-align:top;}
.footer_counsel .box2 textarea {width:100%; height:110px; padding:5px 10px; border:0; font-weight:300; font-size:22px; color:#000;}
.footer_counsel .box3 {float:right; width:20%; position:relative}
.footer_counsel .frow {margin-bottom:10px; position:relative; padding-left:100px;}
.footer_counsel .frow label {position:absolute; left:0;}
.footer_counsel .frow2 { margin-bottom:10px; position:relative; padding-left:80px}
.footer_counsel .btn_submit {width:100%; margin-top:36px; font-size:24px; color:#ffffff; line-height:50px; background:#3264c7;}
.footer_counsel .checkbox { width: 18px; height: 18px; vertical-align: middle; border: 5px solid #3a3a3a; background-color: transparent;}
.footer_counsel .privacy{position:absolute;top:0;color:#000;font-size:16px;letter-spacing:-.5px; text-align:left}

@media screen and (max-width:1080px) {
    .footer_counsel h2 { width:100%; float:none}
    .footer_counsel .box1 { width:100%;}
    .footer_counsel .box2 { width:100%; padding:0 32px}
    .footer_counsel .box3 { width:100%; padding:0 32px}
}

이 질문에 댓글 쓰기 :

답변 2

.footer_counsel{

position : fixed;

(top,bottom,left,right) : 원하는 값 px 

}

넣어봤는데 div 따라 다니는게 아니고 삭제되어 버리네요? ㅠ 

왜 그럴까요?

 

<사이트>

http://saeidental.com

답변을 작성하시기 전에 로그인 해주세요.
QA 내용 검색
질문등록
전체 129,102
© SIRSOFT
현재 페이지 제일 처음으로