브라우저 창 크기가 자바 스크립트로 바뀔 때 div 너비를 변경하는 방법

자바 스크립트 (jQuery 없음)를 사용하여 브라우저 창의 크기가 바뀔 때 div 너비를 변경하는 방법은 무엇입니까? 사용자가 브라우저의 크기를 조정할 때이 작업을 동적으로 수행하려고합니다. 도와주세요, 즉시 ... css로이 직업에 대한 제안이 있으십니까?브라우저 창 크기가 자바 스크립트로 바뀔 때 div 너비를 변경하는 방법

출처

2014-03-25 misagh01

왜 CSS가 아닌가요? – Bobby5193

크기 조정 이벤트를 읽었습니까? 지금까지 뭐 해봤 어? https://developer.mozilla.org/en-US/docs/Web/Reference/Events/resize – Mathias

과부하가 걸릴 경우 CSS가 훨씬 우수한 jQuery를 수행하기 때문에 CSS를 간단한 작업으로 사용해야합니다. –

비율을 사용하십시오. 예 : width="50%" 브라우저 크기가 변경되면 너비가 변경됩니다.

출처

2014-03-25 14:50:08 SSMA

을 볼 수 있기 때문에이 코드는 저에게 적합하지 않습니다. div 엘리먼트의 부모는 고정 너비이고 shoulde는 고정 너비입니다. – misagh01

당신은 CSS 나에 javscript 이것을 설정할 수 있습니다

CSS 손쉽게 %의 즉

div { 
    width: 95%; 
}

을 사용하여 수행 할 것

JS 쉽게

var element = document.getElementById("x"); 
window.addEventListener('resize', function(event) { 
    element.style.width = window.style.width; 
});

출처

2014-03-25 14:50:41

감사합니다.이 코드는 저에게 적합하지 않습니다. 왜? – misagh01

정확히 작동하지 않는 것은 무엇입니까? jsfiddle은 당신을 도와 주는데 아주 좋을 것입니다. –

이 코드를 사용해야 할 것이다 모든 브라우저에서 작동합니다. 하지만 실제로 CSS를 사용해야합니다.

<!DOCTYPE html > 
<html> 
<head> 
    <meta charset="utf8" /> 
    <title>untitled</title> 
</head> 
<body> 
<div id="myDiv" style=" height: 200px; margin:10px auto; background: green;"></div> 

<script type="text/javascript"> 
var myElement = document.getElementById('myDiv'); 
function detectWidth(){ 
    var myWidth = 0; 
    if(typeof (window.innerWidth)== 'number'){ 
     myWidth = window.innerWidth; 
    } 
    else { 
     myWidth = document.documentElement.clientWidth; //IE7 
    } 
    myElement.style.width=myWidth-300+'px'; 
} 
window.onload=function(){ 
    detectWidth(); 
}; 
window.onresize = function(){ 
    detectWidth(); 
}; 
</script> 
</body> 
</html>

출처

2014-03-25 15:32:58 Nillervision

브라우저 창 크기가 자바 스크립트로 바뀔 때 div 너비를 변경하는 방법

답변

관련 문제