페이스 북 스타일 고정 헤더

Question

내 사이트에 http://www.merkato.hu의 헤더는 고정 된 위치에 있습니다. 데스크톱 브라우저에서는 정상적으로 작동하지만 모바일 장치에서는 페이지를 확대하면 고정 위치 지정으로 인해 헤더를 사용할 수 없게됩니다.

나는 높이와 html을 절대적으로 헤더와 컨텐트에 위치시키고 오버 플로우를 스크롤하도록 설정하는 방법을 시도했다. 그러나 스크롤 할 수있는 본문이 필요한 스크립트가있다.

모바일 용 고정 헤더를 구현하는 가장 좋은 방법은 무엇입니까? 내가 찾은 무엇도 iDevices에 대해 가치있는 것으로 보이지 않습니다.

Answer 1

이것은 어려운 문제입니다. 대부분의 모바일 장치에서 fixed 위치 지정 지원이 끊기거나 누락되었습니다. 이를 지원하는 최초의 모바일 브라우저는 올해 제작 된 기기와 함께 제공됩니다.

나는 jQuery Mobile 팀이 고정 된 머리글과 바닥 글로 꽤 오래 힘들었던 것을 기억합니다.

그들이 제대로 작동하므로 jQuery Mobile (또는 분명히 할 수있는 다른 프레임 워크)을 사용하거나 JS 및 CSS를 조사하여 작동 방식을 확인하는 것이 좋습니다.

어쨌든 약 20 개의 다른 테스트 장치가 없으면 제대로 작동하는지 확인할 수 없습니다. 따라서 예산이 충분하지 않으면 잘 테스트 된 오픈 소스 솔루션을 고수해야합니다.