브라우저의 화면 너비를 고정하는 방법은 무엇입니까?

스마트 폰에서이 테스트 웹 사이트 ltdcoapp.uphero.com으로 이동 한 다음 화면을 슬라이드하면 오른쪽에 무엇이 있는지 확인할 수 있습니다. 문제는 다음과 같습니다. 화면이 슬라이드되어 숨기려고하는 것을 보여줍니다. 오른쪽.브라우저의 화면 너비를 고정하는 방법은 무엇입니까?

내 시도는 지금까지 데스크탑 브라우저에서만 작동하는 body{overflow-x: hidden;}을 사용하는 것이 었습니다.

이 문제를 방지하려면 어떻게해야합니까?

PS : 정말 웹 사이트에 트래픽을 얻으려고 아니지만, 쉽게

출처

2014-02-14 Writz

뭔가 숨기려고하면 'display : none;'을 사용하십시오. – RobinvdA

@ RobinvdA 글쎄, 문제는 그것이 숨겨져 있지 않다는 것입니다. 슬라이드 쇼입니다. – Writz

당신은 그것을 숨기려고 할 수 있습니다. – RobinvdA

오버플로 : 숨겨진 속성으로 해당 너비를 설정 했습니까?

편집 : 너비가 100 % 인 상대 값은 작동하지 않습니다 (화면의 오른쪽 부분도 포함 됨). (이 예에서 :가 1024px) : 절대 픽셀 값으로 수정

body { 
    overflow-x: hidden 
    width: 1024px 
}

또한 헤더에 해당 뷰포트 메타 태그를 추가하는 데 도움이 될 수 있습니다 또한

<meta name="viewport" content="user-scalable=no, width=1024px, initial-scale=1.0" />

, 모두 스크롤하지 않도록 것 해결책이 되겠습니까? Disable scrolling in all mobile devices

출처

2014-02-14 12:27:52 dominikus

예. 그렇지만 수직 스크롤도 방지합니다. – Writz

새로운 제안 (예 : 뷰포트, 폭 고정)을 시도해 볼 수 있습니까? – dominikus

은 {width : 1024px} 라인이 있거나없는 메타 라인을 시도했지만 그 중 아무 것도 작동하지 않았습니다. 가로 스크롤 만 방지하는 옵션이 있습니까? – Writz

당신은 신체의 외부 스타일을 가질 수있다 당신에게 문제를 보여줄 수있는 유일한 방법입니다. Firefox의 스타일 정보 도구로 스타일을 검사하십시오.

출처

2014-02-14 12:16:56 good3n

나는 이미 신체 외부의 스타일링을 가지고 있으며 파이어 폭스 스타일의 정보 도구는 크롬의 요소 검사 도구와 동일합니다. 이러한 도구를 사용해도이 상황에서 정확히 어떤 작업을 수행 할 수 있습니까? – Writz

글쎄, 당신은 안으로 다시 스타일링을 넣어해야합니다 .. 그것은 범람이야. – good3n

네, 그게 바로 내가 원하는 방법입니다. 넘쳐 흐르고 숨겨진 것입니다. 그리고 오른쪽에서 돌아올 때 넘쳐 흐르지 않을 것입니다. – Writz

이 것은 내 터치 상황에서 아무런 반응이없는 터치 반응을 방지합니다.

document.body.addEventListener('touchstart', function(e){ e.preventDefault(); });

이 것은 매우 유용 할 것이지만, 문제는 가로 및 세로 스크롤을 방지한다는 것입니다.

document.body.addEventListener('touchmove', function(e){ e.preventDefault(); });

이것은 데스크톱 브라우저에서만 작동합니다.

body{overflow-x: hidden;}

이에게 그것은 어떤 점에서 유용한 페이지를 확장에서 사용자를 방지하기 위해 할 몇 번 모든 시도했지만 오른쪽으로 스크롤 문제가 해결되지 않습니다.

<meta name="viewport" content="width=device-width; initial-scale = 1.0;user-scalable=no" />

Thx dominikus, 반드시 도움이됩니다.

출처

2014-02-14 13:49:30 Writz

브라우저의 화면 너비를 고정하는 방법은 무엇입니까?

답변

관련 문제