div 내용 선택하여 드래그시 이미지가 빠져나와 이동되는 현상

위의 이미지 같이 선택하여 드래그시 이미지가 빠져나와 이동되는 현상을 막고 싶습니다..

css는 잘 몰라서..

자바 스크립트로

document.onselectstart = new Function('return false');

div 속성당

draggable=false

addEventListener("dragstart", function (e) { return false; });

addEventListener("contextmenu", function (e) { return false; });

<style>

.div{

-webkit-touch-callout: none; /* iOS Safari */

-webkit-user-select: none; /* Safari */

-khtml-user-select: none; /* Konqueror HTML */

-moz-user-select: none; /* Firefox */

-ms-user-select: none; /* Internet Explorer/Edge */

user-select: none; /* Non-prefixed version, currently

supported by Chrome and Opera */

}

</style>

이렇게 이벤트를 주고 style도 줘봤는데 안 먹히고 내용이 선택되고 이동까지 되네요.

백엔드로 와서 프론트도 같이 하려니... 많이 후달리네요.. 죄송합니다.