버벅거림 어떻게 해결해야 할까요?
본문
https://www27.iclickart.co.kr/customer/eventdiscount
.buy{z-index:999; width:100%; height:100px; background:#fe6902; position:fixed; bottom:0; display: flex; justify-content: center;}
.fix{position:static;}
<script>
$(window).scroll(
function(){
//스크롤의 위치가 윈도우 스크롤(문서) + 윈도우 높이 값이 > 문서 높이 - footer값
if($(window).scrollTop() + $(window).height() >= $(document).height() - 160 ) {
/* if(window.pageYOffset >= $('원하는위치의엘리먼트').offset().top){ */
$('.buy').addClass("fix");
//위의 if문에 대한 조건 만족시 fix라는 class를 부여함
}else{
$('.buy').removeClass("fix");
//위의 if문에 대한 조건 아닌경우 fix라는 class를 삭제함
}
}
);
</script>
하단이 160px남을때 position:fixed를 static하려고 위에 코드를 썼는데
아랫쪽에서 스크롤 내릴때 버벅거리는 증상 어떻게 해결해야할까요?
아니면 평소에는 position:fixed; bottom:0;으로 되어 있다가
하단에서 160px 떨어지면 position:static이 되도록 하려면 어떻게 해야할까요?
고수님들 도와주세요~!
답변 1
buynow 영역을 별도로 감싸는 div 하나 추가해서 해당 영역
fixed 로 인해 붕안떠지게 추가 하면 될듯한데요..
<div class="" style="height:100px;">
<div class="buy fix" id="buyNow"><a href="/mypage/extension"><img src="/resource/images/customer/oct_promotion/buy_img.png"></a></div>
</div>
감사합니다~! 딱 원하던 답변이였습니다!!
답변을 작성하시기 전에 로그인 해주세요.
