2013-08-04 2 views
-2

수평 전환 레이아웃이 적용된 웹 사이트 (html/css/jquery)를 만들고 있는데, 여기에 샘플 : http://codepen.io/anon/pen/eqBGb이 있습니다. 사실 그것은 지정된 ID로 이동하는 단일 div입니다.가로 전환 레이아웃의 페이지를 독립적으로 스크롤

내 문제는 텍스트가 많은 "페이지"(ID)가 하나만 있어도 단일 div이므로 항상 동일한 높이로 항상 오버플로됩니다.

모든 페이지에 독립적 인 스크롤 값이있는이 최종 결과 http://imakewebthings.com/jquery-waypoints/을 어떻게 얻을 수 있습니까?

+0

질문에 코드를 포함하십시오. – apaul

+0

여기에 있습니다 http://codepen.io/anon/pen/eqBGb – Leonardo

+0

왜 보류 상태입니까? 코드가 포함되어 있으며 문제가 명확합니다. – Frizi

답변

0

http://codepen.io/anon/pen/cpBfI

당신은 강제로 필요 "높이 : 100 %;" .contentbox까지의 모든 요소에 적용되므로 콘텐츠가 넘치는 유일한 요소가됩니다 (크기가 100 %를 초과 할 수 있기 때문에). 그런 다음 .contentbox은 오버플로를 auto로 설정해야하므로 화면 크기가있는 요소보다 내용이 클 경우 고유 스크롤 막대를 가질 수 있습니다.

편집 : http://codepen.io/anon/pen/tcDGr

당신은 여전히 ​​네비게이션 바에 문제가 있었다. 전체 몸이 전혀 움직이지 않기 때문에이 디자인에서는 고정해서는 안됩니다. 절대 위치에 두는 것이 더 좋습니다. 그래도 콘텐츠는 그 아래에 있습니다.

내 해결 방법은 .contentbox-wrapper의 위쪽 채우기를 navbar의 크기로 설정하고 적절한 box-sizing을 적용하여 높이를 100 %로 유지하는 것입니다.

+0

Frizi, 고맙습니다. 예를 들어 탐색 모음은 여기에 배치되었습니다. 어쨌든 절대적인 자세가 더 적절하다. – Leonardo