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

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

QA

SIR 제작의뢰 - 견적무료/익명보정/호스팅, DB 이전/단기개발. 이젠 ' 의뢰인'이 원하는 '제작자'에게만 연락처를 알릴 수 있습니다.

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

본문

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

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

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

 

작아지기 전에는 저기 써있는 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차로 정하고

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

주소복사
채택됨
답변의 댓글
답변을 작성하시기 전에 로그인 해주세요.
전체 66,594 | RSS
고마운 분의 도움으로 질문을 해결하셨다면, 채택을 눌러서 감사의 마음을 전하세요.
어떻게 질문해야 할지 모른다면 질문하는 방법을 읽어 보신후 질문해 보세요.
QA 내용 검색

회원로그인

진행중 포인트경매

  1. [성인영어학습지] 호호네 브런치 2018년 9월호

    참여8 회 시작18.10.17 09:46 종료18.10.22 09:46

(주)에스아이알소프트 (06253) 서울특별시 강남구 도곡로1길 14, 6층 624호 (역삼동, 삼일프라자) 대표메일:admin@sir.kr
사업자등록번호:217-81-36347 대표:홍석명 통신판매업신고번호:2014-서울강남-02098호 개인정보보호책임자:이총

© SIRSOFT