Preventing an image from being draggable or selectable without using JS
Set the following CSS properties to the image:
.selector {
user-drag: none;
-webkit-user-drag: none;
user-select: none;
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
}
You can use the pointer-events
property in your CSS, and set it equal to 'none'
img {
pointer-events: none;
}
Edited
this will block (click) event. So better solution would be
<img draggable="false" (dragstart)="false;" class="unselectable">
.unselectable {
user-drag: none;
user-select: none;
-moz-user-select: none;
-webkit-user-drag: none;
-webkit-user-select: none;
-ms-user-select: none;
}