img 태그 우클릭 차단
2022. 10. 7. 23:13ㆍWeb
728x90
보통 인스타그램과 같이 우클릭이 막혀있는 서비스들을 종종 볼 수 있습니다.
인스타그램의 방식은 보통 div 태그를 만들어서 z-index 우선순위를 위해 뒤에 나오게 한 다음 absolute 로 박스크기를 가득 채워버립니다. 저도 이전에는 이러한 방식을 종종 사용했었는데, 더 간단하고 쉬운 방법이 있어서 기록과 공유차 포스팅을 진행합니다.
pointer-events: none;
그냥 css나 style로 img태그에 pointer-events 즉 클릭과 같은 모든 포인터에 대한 요소를 막아버리면 끝입니다.
728x90
'Web' 카테고리의 다른 글
Modern Web의 4가지 렌더링 방식에 대한 고찰 (0) | 2021.06.07 |
---|---|
GraphQL의 토큰 만료 응답 관리 (0) | 2021.05.14 |
Nuxt.js + Apollo GraphQL Sitemap.xml 만들기 (0) | 2020.04.18 |
Nuxt + Apollo Graphql => Generate로 SSG/SEO 적용하기 (0) | 2020.04.01 |
Firebase로 Serverless Push 알림 발송 구현하기 (0) | 2020.03.30 |