Отключить перетаскивание изображения со страницы HTML

Question

Мне нужно разместить изображение на моей странице. Я хочу отключить перетаскивание этого изображения. Я пытаюсь много вещей, но без помощи. Кто-нибудь может мне помочь?

Я не хочу сохранять это изображение как фоновое изображение, потому что я изменяю размер изображения.

Answer 1

Я сделал свойства css, показанные здесь, а также ondragstart монитора со следующим JavaScript:

handleDragStart: function (evt) {
    if (evt.target.nodeName.match(/^(IMG|DIV|SPAN|A)$/i)) {
      evt.preventDefault();
      return false;
    }
  },

Answer 2

Вы можете использовать встроенный код для этого

<img draggable="false" src="http://www.ourkanpur.com/images/logo.png">

И второй вариант - использовать внешний или локальный css

img {
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-user-drag: none;
  user-drag: none;
  -webkit-touch-callout: none;
}

<img src="http://www.ourkanpur.com/images/logo.png">

Оба работают правильно Я использую внешние css на этом сайте (Нажмите здесь)

Answer 3

Кража из моего ответа , просто добавьте полностью прозрачный элемент того же размера поверх изображения.При изменении размера изображения обязательно измените размер элемента.

Это должно работать для большинства браузеров, даже более старых.