[jQuery] 스크롤값에 따른 anchor offset 적용

css

.anchor_point_topmargin1 {display: block; position: relative; top: -150px; visibility: hidden;}
.anchor_point_topmargin2 {display: block; position: relative; top: -50px; visibility: hidden;}

 

jQuery

$('.anchor_point').addClass('anchor_point_topmargin1');
$(window).scroll(function () {
    var scrollValue = $(document).scrollTop();
    if (scrollValue == '0') {
        //console.log(scrollValue);
        $('.anchor_point').addClass('anchor_point_topmargin1');
        $('.anchor_point').removeClass('anchor_point_topmargin2');
    } else {
        $('.anchor_point').removeClass('anchor_point_topmargin1');
        $('.anchor_point').addClass('anchor_point_topmargin2');
    };
});

 

References :

- [jQuery] 현재 스크롤값 가져오기(scroll)

- [css] anchor offset (for fixed header) : 10 solutions