2011-01-11 3 views
0

자바 스크립트 함수를 사용하여 onload 이벤트를 사용하여 사용자 화면 해상도를 기반으로 3 개의 DIV 스타일을 재설정합니다.로드시 자바 스크립트 화면 해상도 재설정

if(screen.width > 1024 && screen.width < 1300){ 
document.getElementById('wrapper').style.width = '1250px'; 
document.getElementById('innerwrapper').style.width = '1250px'; 
var elms = getElementsByClassName("colmask", "div")[0].style.width = '1250px'; 
} 
if(screen.width > 1300 && screen.width < 1500){ 
document.getElementById('wrapper').style.width = '1350px'; 
document.getElementById('innerwrapper').style.width = '1350px'; 
var elms = getElementsByClassName("colmask", "div")[0].style.width = '1350px'; 
} 
if(screen.width > 1500){ 
document.getElementById('wrapper').style.width = '1580px'; 
document.getElementById('innerwrapper').style.width = '1580px'; 
var elms = getElementsByClassName("colmask", "div")[0].style.width = '1580px'; 
} 

문제는 사용자가 페이지를로드 한 후 자동으로 크기를 조정하는 새 페이지로 이동할 때마다 발생합니다. 항상 페이지의 크기를 조정하지 않아도되는 방법이 있습니까? 당신이 jQuery를 사용하기로 결정하는 경우

+2

에 배치 할 수있는 당신은 무딘 것에 대해 용서 것이다 경우 판단적으로, 이것은 끔찍한 생각입니다. 고정 폭 레이아웃, 특히 픽셀 값에 연결된 레이아웃은 사용하지 마십시오. (사용자를 보호하고 고정 된 선 길이를 목표로하기 위해 너비가 글꼴 크기에 따라 고정 된 열에 대량의 산문을 표시하기 위해 유효한 인수가 있습니다.) 화면에서 작동하는 동적 레이아웃을 만듭니다 및 다양한 해상도 및 dpi 장치. – Phrogz

+0

해상도가 페이지 너비를 지원한다고해서 브라우저가 전체 화면으로 표시된다는 의미는 아닙니다. 사용자는 단순히 * 화면 * 해상도를 기반으로 컨텐츠를 수용 할만큼 브라우저를 충분히 커야 만합니다. – Soviut

+0

당신이 이것을 주장한다면, AJAX 나 폼을 통해 너비/높이를 다시 서버로 보내고 클라이언트가 이미 크기 값을 가진 CSS를 출력하게하십시오. 이렇게하면 페이지가 적절한 크기로 자동으로 렌더링되어 "팝업"하지 않아도됩니다. –

답변

0

내가 코멘트 위의 브라우저의 크기에 따라이 동적으로 만들하기로 동의 아주 쉽게

당신이해야 할 var wcontent=$(window).width();

$("#wrapper").width(wcontent); 
입니다

에 당신이 $(document).ready(function() {}

+0

jquery를 사용하고 있지 않지만 이것은 내가 이미 수행하고있는 것과 동일하지 않습니까? – Shahid

+0

나는 어제 그 고정 div 크기에 대한 다른 모든 의견을 전에 또한 사용자가 새 페이지로 탐색 할 때 크기를 조정하지 않는이 방법으로 썼습니다. 그 분명히 같은 그냥 조금 더 관리 – elasticrash