2011-10-21 2 views
3

#center에 할당 된 width 값을 어떻게 변경합니까? (CSS 파일간에 전환하고 싶지는 않습니다. 1이 width 값을 변경했기 때문입니다.) 자바 스크립트를 사용하여 값을 어떻게 동적으로 변경합니까?Javascript를 사용하여 요소 너비를 변경하려면 어떻게해야합니까?

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 
<style type="text/css"> 
    #main #center { 
     width: 600px; // change width to 700 on click 
     float: left; 
    } 

    #main #center .send { 
     background: #fff; 
     padding: 10px; 
     position: relative; 
    } 

    #main #center .send .music { 
     text-align: center; 
     margin-bottom: 10px; 
    } 

    #main #center .send .write { 
     font-family: georgia, serif; 
     font-size: 150px; 
     opacity: 0.2; 
    } 

    //....etc. 
</style> 
</head> 

<body> 
    // change #center width to 700 
    <a href="#go2" onclick="how to change width of #center ???" ></a> 
</body> 
</html> 

답변

3
document.getElementById('center').style.width = "599px"; 
2

두 가지 방법 :

  1. 것은 "센터"다른 CSS 규칙을
  2. 알터 요소
0

전화의 "스타일"속성과 일치하는 클래스 값을 요소를 부여 DOM 요소를 사용하여 새로운 너비를 설정하거나 요소의 클래스를 변경하는 onclick의 javascript 함수

function changeWidth(){ 
    document.getElementById('center'); 
    div.style.width="1270px"; 
} 
0
<div onclick="changeWidth()" id="main"> 
Stuff 
</div> 

<div onclick="changeWidth()" id="center"> 
More Stuff 
</div> 

function changeWidth(){ 
    this.style.width = "700px"; 
} 
1
document.getElementById('center').style.width = "700px"; 
관련 문제