한 번의 클릭으로 지속되는 dom에서 변경하는 방법

Question

웹 페이지를 만들고 있는데 시체를 설정했습니다. backround-image. 사용자가 마우스 키를 누를 때 이미지의 URL을 변경하고 마우스 키를 놓을 때 이미지의 URL을 변경하는 방법이 있습니까? 기본적으로 변경 사항은 클릭 자체와 동일한 시간 지속됩니다.

또한 페이지의 아무 곳이나 클릭 할 때이 변경 사항이 어떻게 적용되는지 어떻게 알 수 있습니까? body 요소에 이벤트 리스너를 추가하면 충분합니까? 미리 감사드립니다.

Answer 1

: active pseudo-class는 사용자가 요소를 활성화하는 동안 적용됩니다. 예를 들어, 사용자가 마우스 버튼을 누르고 그것을 놓는 시간 사이에. 두 개 이상의 마우스 버튼이있는 시스템에서 : 활성은 주 또는 기본 활성화 버튼 (일반적으로 "왼쪽"마우스 버튼) 및 해당 별칭에만 적용됩니다.

css3-selectors spec

---

순수 CSS 예 : mouseup` 이벤트가 배경 이미지를 다시 설정 한 후 설정하는

body:active { 
    background-image: [IMAGE]; 
} 

Example jsfiddle