티스토리 뷰

CSS

CSS cusor:pointer, pinter-events:none;

블로그 강승 2021. 3. 28. 22:18

CSS cusor:pointer, pointer-events:none;

a.{
	cusor:pointer;
}

이런식으로 주면 클래스 a에 마우스를 올리면 커서가 pointer 형식으로 바뀜(손가락 모양)

 

.b{
	pointer-events:none;
   }

b 클래스는 클릭 이벤트를 받지 않음.
하지만 pointer-events:none; 을 주면 하위 태그도 이벤트를 못줘서 어떤 경우엔 쓸 수가 없음.
그럴땐 스크립트로 해결해야함.

 

let elem=event.target;
while(!elem.classList.contains('menu-btn')) {
		elem = elem.parentNode;
        
        if(elem.nodeName == 'BODY'){
        	elem=null;
            return;
            }
}

클릭 이벤트 함수 안에 들어간 내용인데, 이런식으로 자바스크립트로 해결해야함.

'CSS' 카테고리의 다른 글

CSS transform, animation  (0) 2021.03.25
CSS background url 경로찾기  (0) 2021.03.25
댓글