2012-07-31 3 views
3

동적 페이지를 만들었다면 스크롤바가 필요없는 페이지 높이로 시작한 다음 내용을 동적으로 추가하면 스크롤 막대가 나타납니다. 이 작업을 수행하면 내 콘텐츠를 모두 스크롤 막대의 왼쪽 너비로 밀어 넣고 페이지의 모든 내용이 조금씩 이동합니다.스크롤바 위치를 지정할 수 있습니까? 절대적입니까?

스크롤 막대가 위치 절대 값처럼 작동하도록 할 수 있으므로 내 콘텐츠를 모두 왼쪽으로 밀기보다는 콘텐츠 위에 배치합니다. 나는 내용이 모두 왼쪽으로 점프하는 방식을 좋아하지 않는다. 그것은 더러워 보입니다.

고마워요.

+0

'window.resize' 이벤트 핸들러를 사용하면'document'와'window'의 높이를 비교하여 스크롤바가 필요할 때를 감지하고 필요에 따라 몸체의 오른쪽 여백을 추가하거나 제거 할 수 있습니다. javascript 솔루션, 그리고 약간의 연습이 더러워진 것 같습니다. – jackwanders

답변

1

할 수는 있지만 완벽하지는 않습니다. this 게시물에서 코드를 복사 :

// Used like $('#my-id').hasScrollbar(); 

jQuery.fn.hasScrollbar = function() { 
var scrollHeight = this.get(0).scrollHeight; 

//safari's scrollHeight includes padding 
if ($.browser.safari) 
    scrollHeight -= parseInt(this.css('padding-top')) + parseInt(this.css('padding-bottom')); 

if (this.height() < scrollHeight) 
    return true; 
else 
    return false; 
} 

당신은 스크롤 막대가 존재하는지 조회 할 수있다. 이 전에, 그러나, 당신이 나타나는 스크롤하기 전에 뷰포트의 폭 전역 변수해야합니다 :

var viewportWidth = $(window).width(); 

그리고 위의 기능을 실행 한 후를, 당신의 새로운 뷰포트의 폭이 viewportWidth을 비교할 수 스크롤 막대가있는 창 margin-rightbody의 차이가 음수입니다.

+0

저는 처음에 그 일을 실제로 생각했지만 가능한 경우 CSS 솔루션을 원했습니다. 아마 하나의 방법이 없을 것 같아서 아마 ur 메서드를 사용할 것입니다. 감사 –

0

부탁드립니다. 수행 할 수 없습니다.

#id { 
    overflow: scroll; 
} 

을하지만이 끔찍하게 못생긴 :

당신은 그러나 항상 표시하도록 강제 할 수있다.

관련 문제