테스트 사이트 - 개발 중인 베타 버전입니다

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

일이리 7년 전 조회 2,516

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

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

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

 

작아지기 전에는 저기 써있는 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});     }); });

 

도움 부탁드립니다!ㅠㅠ

 

 

</p>

<p><script src="<a href="<a href="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script" target="_blank" rel="noopener noreferrer">https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script</a>"><a href="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script" target="_blank" rel="noopener noreferrer">https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script</a></a>>

<script type="text/javascript"></p>

<p> 

$(function(){

    var $win = $(window);

    var top = $(window).scrollTop(); // 현재 스크롤바의 위치값을 반환합니다.</p>

<p>    /*사용자 설정 값 시작*/

    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');

    /*사용자 설정 값 끝*/</p>

<p>    // 스크롤 바를 내린 상태에서 리프레시 했을 경우를 위해

    if (top > 0 )

        $win.scrollTop(layerTopOffset+top);

    else

        $win.scrollTop(0);</p>

<p>    //스크롤이벤트가 발생하면

    $(window).scroll(function(){

        yPosition = $win.scrollTop() - 980;

        if (yPosition < 0)

        {

            yPosition = 0;

        }

        $layer.animate({"top":yPosition }, {duration:speed, easing:easing, queue:false});

    });

});</p>

<p> </p>

<p></script></p>

<p>

댓글을 작성하려면 로그인이 필요합니다.

답변 1개

채택된 답변
+20 포인트
히치하이킹

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

 

https://sir.kr/g5_tip/8489

 

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

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

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

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

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인