2013-06-06 1 views
0
에있는 모든 요소의 변화를 야기

CSS와 하단 바있다 : JS 기능은 페이지

#bottom_nav { 
    position: absolute; 
    bottom: 0; 
    left: 0; 
    border-top: solid 1px lightgray; 
    background: url('http://localhost:3000/assets/font-try.jpg'); 
    height: 70px; 
    width: 100%; 
    font-family: "ProximaNova", "Helvetica Neue", Helvetica, Arial, sans-serif; 
    font-size: 12px; 
    font-weight: 400;} 

그리고 일부 AJAX 작업에

이 JQuery와 기능 요소를 방지하기 위해 바닥 сover 바 :

var $beforeBar= $('#bottom_nav').prev().offset().top; 
    var $beforeBarPosition=$beforeBar+ $('#bottom_nav').prev().height(); 
if($beforeBarPosition+50>=$('#bottom_nav').offset().top){ 

     $('#bottom_nav').css({'top':$(document).height()+100}); 
    } 

문제는이 함수가 호출 될 때마다 페이지의 모든 요소가 약간 왼쪽으로 이동한다는 것입니다. 정말 못 생겼어. 기능을 사용 중지하면 전환이 발생하지 않습니다. 또한

, jsfiddle

편집 :

Yeath, 나는 그것이 문서의 높이를 변경하는 방법에 윈도우 스크롤 패널을 표시하고, 그것을 얻었다. 모든 솔루션?

+0

도움이되는 정보가 충분하지 않습니다. JSFiddle은 문제를 재현하지 않는 것 같습니다. 링크 URL을 죽이고 똑같은 결과를 얻는 지 알아보기 위해 바이올린으로 테스트 해 주시겠습니까? 일단 복제하면 도움을 줄 수 있습니다. –

+0

링크가 끊어졌습니다. 그렇습니다. 이제는 문제가 다시 발생합니다. 처음 클릭하면 왼쪽에서 호스트가 오른쪽으로 이동하지만 중요하지 않습니다. –

답변

0

시프트는이 광고에 기인한다 :

$('#bottom_nav').css({'top':$(document).height()+100}); 

이 효과적으로 170px하여 문서의 높이를 증가 ... 문서의 끝을지나 #bottom_nav 소자 (100)의 픽셀의 상부를 설정한다 (100px + 높이는 #bottom_nav). 다음 번에이 코드를 실행하면 $(document).height()에서 반환되는 값이 170보다 높으므로 페이지가 다른 170px만큼 높이가 확장됩니다.

+0

아니오, 교대가 수평이다, 그것은 "왼쪽"이라고한다. 대답하기 전에 질문을 읽는 것이 좋습니다. 어쨌든 이유는 @passerby가 말합니다. –

+0

가로 이동은 임의로 증가하는 문서 길이로 인해 나타나는 스크롤 막대가 원인입니다.지속적으로 증가하는 길이가 의도적인지 아닌지는 명확하지 않습니다. 그렇지 않은 경우 실제 수정은 스크롤바의 부작용이 아니라 * 해결되어야합니다. – jcsanyi