버벅거림 어떻게 해결해야 할까요? 채택완료
woal274
3년 전
조회 2,224
https://www27.iclickart.co.kr/customer/eventdiscount
</p>
<p>.buy{z-index:999; width:100%; height:100px; background:#fe6902; position:fixed; bottom:0; display: flex; justify-content: center;}</p>
<p>.fix{position:static;}
</p>
<p><script></p>
<p>$(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를 삭제함
}
}
);</p>
<p></script></p>
<p>
하단이 160px남을때 position:fixed를 static하려고 위에 코드를 썼는데
아랫쪽에서 스크롤 내릴때 버벅거리는 증상 어떻게 해결해야할까요?
아니면 평소에는 position:fixed; bottom:0;으로 되어 있다가
하단에서 160px 떨어지면 position:static이 되도록 하려면 어떻게 해야할까요?
고수님들 도와주세요~!
댓글을 작성하려면 로그인이 필요합니다.
답변 1개
채택된 답변
+20 포인트
3년 전
buynow 영역을 별도로 감싸는 div 하나 추가해서 해당 영역
fixed 로 인해 붕안떠지게 추가 하면 될듯한데요..
</p>
<p><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></p>
<p>
로그인 후 평가할 수 있습니다
답변에 대한 댓글 1개
w
woal274
3년 전
감사합니다~! 딱 원하던 답변이였습니다!!
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인