배경색 HTML을 어떻게 동적으로 변경할 수 있습니까?

Question

이벤트에 대한 응답으로 html 또는 본문의 배경 (그라데이션)을 변경하고 싶습니다. jQuery를 사용하여 배경색 속성을 변경할 수 있습니까? 또는 (CSS 그라데이션 *에 설명 된 배경 그라디언트가 있습니다.) 클래스를 제거하고 클래스를 추가해야합니까? 후자의 경우 약간의 딜레마가 있습니다. 세 가지 색상을 사용하려고합니다. removeClass를 통해 다른 색상을 모두 제거해야합니까 (분명히 하나만 활성화 될지라도), 또는 현재 어떤 색상이 사용 중인지 프로그래밍 방식으로 확인하고 제거하는 방법이 있습니까? 나는 그것을 추적 할 준비가 된 함수의 꼭대기에 global var를 사용할 수 있다고 생각하지만, 더 나은/더 우아한 방법이 있는가?

• 여기 http://www.colorzilla.com/gradient-editor/를 사용하여 예를 들어 CSS 클래스 생성의 :

  .silverBackground { 
      background: #e2e2e2; /* Old browsers */ 
      background: -moz-linear-gradient(top, #e2e2e2 0%, #dbdbdb 50%, #d1d1d1 51%, #fefefe 100%); /* FF3.6+ */ 
      background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e2e2e2), color-stop(50%,#dbdbdb), color-stop(51%,#d1d1d1), color-stop(100%,#fefefe)); /* Chrome,Safari4+ */ 
      background: -webkit-linear-gradient(top, #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%); /* Chrome10+,Safari5.1+ */ 
      background: -o-linear-gradient(top, #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%); /* Opera 11.10+ */ 
      background: -ms-linear-gradient(top, #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%); /* IE10+ */ 
      background: linear-gradient(to bottom, #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%); /* W3C */ 
      filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e2e2e2', endColorstr='#fefefe',GradientType=0); /* IE6-9 */ 
  } 
  

Answer 1

이 내가 그것을

$('someElement').click(function(){ // 1 
    var newClass = $(this).attr('toggleColor'); // 2 
    $(document.body).removeClass('color1 color2 color3').addClass(newClass); // 3 
}); 

----- 세부 사항을 얼마나입니다 --- ---

는

1. 다른 색상
2. 를 전환 할 요소에 클릭 이벤트를 추가 단계를 난 당신이 요소
3. 모든 색상을 제거에 속성이있을 것이라는 점을 가정하고 새 클래스의 이름을 돌려 클래스에서 요소를 추출한 다음 새 요소를 추가하십시오.