여러 개의 전체 화면 div가 서로 위에 있습니다.

두 개의 전체 화면 div가 서로의 꼭대기에 쌓인 사이트를 만들었습니다. 첫 번째 div를 클릭 할 때 앵커 링크와 jQuery를 사용하여 두 번째 전체 화면 div에 부드러운 스크롤 막대를 만들었습니다.여러 개의 전체 화면 div가 서로 위에 있습니다.

모두 div가 가지고있는 이러한 CSS 속성 :

position: relative; 
width: 100%; 
height: 100%; 
top: 0; 
left: 0; 

display: -webkit-box; 
-moz-background-size: cover; 
-webkit-background-size: cover; 
-o-background-size: cover; 
background-size: cover; 
-webkit-box-orient: vertical; 
-webkit-box-pack: center; 
-webkit-box-align: center;

이 이러한 CSS로 컨테이너 사업부에 의해 incapsulated되는 속성 :

position: absolute; 
width: 100%; 
height: 100%; 
top: 0; 
left: 0;

몸은 오버 플로우가 : 숨겨진; logo-div에는 CSS 속성이 전혀 없습니다.

모든 것이 잘 작동하지만 두 번째 div에있을 때 브라우저 창 높이를 조정할 때 문제가 나타납니다. 두 번째 div의 전체 화면 모드가 잘못되어 첫 번째 div가 표시됩니다.

현재 사이트를 볼 수 있습니다 http://www.nolovelost.nu/test

이 문제를 해결하는 방법에 대한 모든 팁 대단히 감사하겠습니다!

출처

2013-02-08 user2052849

문제를 복제 할 수 없습니다. 어떤 브라우저에 문제가 있는지 알 수 있습니까? –

이 대답은 도움이 될 수 있습니다. http://stackoverflow.com/questions/14609878/set-height-for-element-by-browser-without-cutting-off-the-content/14609958#14609958 –

나는 그것이해야한다고 생각한다.

두 div의 당신이 X 픽셀로 창 크기를 증가시킬 때 상단과 하단 DIV 양쪽의 높이에서 X 더 픽셀 ...을 얻고 낮은 사업부를 '밀어', 100 % 높이가!

jquery 전문가가 아닙니다 ...하지만 하단의 div에서 트릭을해야 할 때와 같은 기능을 제공합니다.

$(window).resize(function() { 
    $('html, body').animate({ scrollTop: $(document).height() }, 0); 
        return false; 
      });

출처

2013-02-08 03:46:23 andsoa

이것이 작동하는 것 같습니다. ,하지만 사실 jquery가 전혀 없다는 것을 알기 때문에, 하위 div에있을 때만이 스크립트를 실행하려면 어떻게해야합니까? – user2052849

Andsoa의 답변이 옳습니다. 창문에서 뭔가 생각 중이에요.

내 대답은 직접하지 않고, 당신이 뭘 하려는지 달성 많은 기존 스크립트가 있습니다, 그래서 당신은 그들을 선택하여 시간을 절약 할 수 있습니다 http://www.impressivewebs.com/parallax-scrolling-scripts-plugins/

출처

2013-02-08 04:32:16

여러 개의 전체 화면 div가 서로 위에 있습니다.

답변

관련 문제