버벅거림 어떻게 해결해야 할까요? 채택완료

https://www27.iclickart.co.kr/customer/eventdiscount

 

Copy
.buy{z-index:999; width:100%; height:100px; background:#fe6902; position:fixed; bottom:0; display: flex; justify-content: center;}

.fix{position:static;}

 

Copy
<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개

채택된 답변
+20 포인트

buynow 영역을 별도로 감싸는 div 하나 추가해서 해당 영역

fixed 로 인해 붕안떠지게 추가 하면 될듯한데요..

 

 

Copy
<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>
로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

감사합니다~! 딱 원하던 답변이였습니다!!

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

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

로그인
🐛 버그신고