[html/css] 이미지 드래그 잔상방지 방법 / 드래그 고스트 이미지 방지 방법

[html/css] 이미지 드래그 잔상방지 방법 / 드래그 고스트 이미지 방지 방법

 

 

홈페이지에서

 

이미지영역을 클릭후 드래그하면

 

고스트이미지라고 하는 잔상이 마우스를 따라

 

움직이는것을 확인할 수 있습니다.

 

그걸 방지하기위해서는

 

css 옵션을 추가하면 됩니다.

 

 

우선 아래와 같은 img 태그가 있다고 가정하고

<img src="location_image_src"/>

 

위 이미지를 드래그 잔상 방지를 하기위해서

 

아래와 같은 style 옵션을 줍니다.

<img src="location_image_src" style="-webkit-user-drag: none;"/>

 

그리고 테스트 해보면 잔상이 안뜨는것을 확인할 수 있습니다.

 

브라우저나 환경에 따라 다른경우가 있다고 하는 분들도 계시는데요!

 

저는 일단 크롬버전에서는 정상동작하는것으로 확인했습니다!

 

참고들 하세요!