2012-12-29 1 views
8

전체 페이지 스크롤에 대한 다른 방법이 있습니까? 전체 페이지 스크롤의전체 페이지 가로 스크롤 관련 문제

예는

http://jscrollpane.kelvinluck.com/fullpage_scroll.html

단계-1 메이크업 창 버튼을 아래로 복원을 클릭하여 작은 폭.

스텝 2 스크롤

단계-3 현재 창을 최대화 단추를 클릭하여 더 큰 폭 만들 오른쪽으로.

은 현재 페이지가

jQuery를

를 왼쪽으로 정렬되어
$(function() 
{ 
    var win = $(window); 

    win.bind(
     'resize', 
     function() 
     { 

       var container = $('#full-page-container'); 

       container.css(
        { 
         'width': 1, 
         'height': 1 
        } 
       ); 

       container.css(
        { 
         'width': win.width(), 
         'height': win.height() 
        } 
       ); 
       isResizing = false; 
       container.jScrollPane(
        { 
         'showArrows': true 
        } 
       ); 

     } 
    ).trigger('resize'); 


    $('body').css('overflow', 'hidden'); 


    if ($('#full-page-container').width() != win.width()) { 
     win.trigger('resize'); 
    } 


}); 

CSS

html 
{ 
    overflow: auto; 
} 
#full-page-container 
{ 
    overflow: auto; 
} 
+0

jquery 코드를 표시 할 수 있습니까? – Chanckjh

+0

@Chanckjh, 업데이트 된 질문을 볼 수 있습니다. jscrollpane 데모 링크를 확인하십시오. –

+0

방금 ​​Chrome을 체크인했습니다. 그렇습니다. –

답변

5

여기 것은 JScrollPane의이 jspPane에게 왼쪽을 추가하는 것입니다 : - *** 픽셀 당신은에 스크롤 할 때 권리. 그리고 그 피해를 취소하지 마십시오.

추가 할 경우

: 당신의 크기 조절에

$('#full-page-container .jspPane').css('left', 'auto');

, 그것은 작동합니다. jScrollPane 친구들에 대한 버그를보고하는 것이 좋습니다.

+0

전체 페이지 스크롤을위한 다른 방법이 있습니까? –

+0

한 프로젝트에서 우리는 jScrollPane을 사용하기 시작했고 그 과정에서 많은 비슷한 문제가있었습니다. 그래서 우리는 작은 부분에만 사용하기로했습니다. 그 부분은 더 화려해야하고 다른 모든 것들을 위해 웹킷 스크롤바 스타일 (http://css-tricks.com/custom-scrollbars-in-webkit/)을 추가했습니다. 대다수의 사용자가 크롬/사파리를 사용 했으므로 충분했습니다. – povilasp

+0

여기에 몇 가지 대체 스크롤 막대 솔루션이 나와 있습니다. http://stackoverflow.com/a/14150577/1085891 – JSuar