스크롤 따라다니는 메뉴 디바이스 크기마다 설정 질문드립니다ㅠㅠ

스크롤 따라다니는 메뉴 디바이스 크기마다 설정 질문드립니다ㅠㅠ

QA

스크롤 따라다니는 메뉴 디바이스 크기마다 설정 질문드립니다ㅠㅠ

본문

영카트에 있는 오늘 본 상품에 있는 스크롤 따라다니는 스크립트를 쓰려고 하는데요,

따라다닐 메뉴를 화면 맨 위로 붙였더니 반응형으로 줄였을때 위로 너무 올라가서 보이질 않더라구요..

반응형 크기에 따라 따라다니는 높이를 스크립트 변경해서 바꾸려고 하는데 어려워서 질문 올립니다..

 

작아지기 전에는 저기 써있는 980로 있다가

width가 610px 보다 작을때에는

저 980이라고 써있는 부분의 높이를 바꾸고 싶은데요..

 

    //스크롤이벤트가 발생하면
    $(window).scroll(function(){
        yPosition = $win.scrollTop() - 980;
        if (yPosition < 0)
        {
            yPosition = 0;
        }
        $layer.animate({"top":yPosition }, {duration:speed, easing:easing, queue:false});
    });
});

 

도움 부탁드립니다!ㅠㅠ

 

 


<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
 
$(function(){
    var $win = $(window);
    var top = $(window).scrollTop(); // 현재 스크롤바의 위치값을 반환합니다.
    /*사용자 설정 값 시작*/
    var speed          = 00;     // 따라다닐 속도 : "slow", "normal", or "fast" or numeric(단위:msec)
    var easing         = 'linear'; // 따라다니는 방법 기본 두가지 linear, swing
    var $layer         = $('#stv_list'); // 레이어 셀렉팅
    var layerTopOffset = 0;   // 레이어 높이 상한선, 단위:px
    $layer.css('position', 'absolute');
    /*사용자 설정 값 끝*/
    // 스크롤 바를 내린 상태에서 리프레시 했을 경우를 위해
    if (top > 0 )
        $win.scrollTop(layerTopOffset+top);
    else
        $win.scrollTop(0);
    //스크롤이벤트가 발생하면
    $(window).scroll(function(){
        yPosition = $win.scrollTop() - 980;
        if (yPosition < 0)
        {
            yPosition = 0;
        }
        $layer.animate({"top":yPosition }, {duration:speed, easing:easing, queue:false});
    });
});
 
</script>

이 질문에 댓글 쓰기 :

답변 1

제가 팁자료실에 올렸던 내용이 있습니다.

 

https://sir.kr/g5_tip/8489

 

콘테이너 안에서 배너 위치 설정하는것인데요.

너무 위로 올라간다면 div의 포지션 문제니 자바스크립트로 높이를 계산하여 그때그때 새로운

포지션을 잡는 방법보다 저 팁처럼 퍼블리싱이 된것을 고쳐서 움직일 범위를 1차로 정하고

자바스크립트를 그에 맞게 원점에서 다시 작업하시는게 현명한 방법인것 같습니다.

답변을 작성하시기 전에 로그인 해주세요.
전체 3,143
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT