0
좋아, 이제는 내 필요에 꼭 들어 맞는 답변을 많이 찾고 있습니다. 내 시나리오는 다음과 같습니다. javascript/html/css에 app이 있습니다. 두 개의 독립적으로 회전 가능한 겹쳐진 요소 (이 경우 두 가지 모두 svg의 두 요소)가 있습니다.이 두 요소는 두 요소가 회전하면서 주름을 잡을 필요가있는 요소가 있습니다. 한 레이어에는 7 개의 클릭 할 수있는 점이 있고 다른 레이어에는 12 개의 클릭 할 수있는 점이 있으며 두 점은 회전의 대상 각도를 설정하는 onclick 이벤트를 기반으로 주어진 점으로 회전합니다. 점 (즉, 두 개의 svg 각각에 원형 반올림의 가장자리에있는 작은 투명 원형) 만 클릭 할 수 있어야합니다. 내 문제는 어떤 레이어를 맨 위의 작품에 적용했는데 다른 레이어의 버튼이 작동을 멈추고 다른 배경의 배경에 의해 차단 된 것입니다. 나는 모든 종류의 포인터 이벤트와 StackOverflow에 대한 다른 아이디어를 망쳐 놓으려고 노력했지만, 같은 결과로 끝난다 : 하나의 버튼 세트가 작동하지 않는다. 그들은 별도의 레이어에 있어야하므로 회전하면 실시간으로 회전하면서 올바른 위치에 배치됩니다. 어떤 아이디어라도 환영합니다. jquery 함께 할 수있는 경우 라이브러리 (jquery 포함) 필요하지 않은 대답을 찾고 있는데 jquery없이 할 수 - 어떻게 찾을 수 있습니다. 누구 아이디어?서로 겹쳐서 겹쳐서 표시된 요소
당신은'pointer-events : none;'으로 놀아 보아서 컨테이너에 적용하고 클릭 할 수있는 부분에 오버라이드 ('pointer-events : all;') 할 수 있습니다. 작동합니다. – dandavis
닫기. 오랜만에 그 해답을 찾았지만 내 자신의 질문에 다른 것을 찾았습니다. 대답은 'pointer-events : none;'스타일입니다. 부모 요소에 'pointer-events : auto;' 자식 요소에서 클릭 할 수 있습니다. 이렇게하면 'auto'로 설정된 요소 만 클릭, 터치 등을 소비하고 상위 요소를 통과하여 그 아래/아래로 전달할 수 있습니다. – jdmayfield