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

Question

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

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

Answer 1

Вам может понравиться это ...

document.getElementById('my-image').ondragstart = function() { return false; };

Посмотрите, как это работает (или не работает, скорее)

Кажется, вы используете jQuery.

$('img').on('dragstart', function(event) { event.preventDefault(); });

Answer 2

Только CSS решение: используйте pointer-events: none

https://developer.mozilla.org/en-US/docs/CSS/pointer-events

Answer 3

просто добавьте draggable = "false" к тегу изображения:

<img draggable="false" src="image.png">

IE8 и ниже не поддерживает, однако.

Answer 4

window.ondragstart = function() { return false; } 

Answer 5

простейшее кросс-браузерное решение -

<img draggable="false" ondragstart="return false;" src="..." />

проблема с

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;
}

это то, что он не работает в Firefox

Answer 6

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;
}

Я использовал его на своем сайте в http://www.namdevmatrimony.in/ Это работает как волшебство !!!:)

Answer 7

Я попробовал себя и обнаружил, что это работает.

$("img").mousedown(function(){
    return false;
});

Я уверен, что это отключает перетаскивание всех изображений.Не уверен, что это влияет на что-то еще.

Answer 8

См. ответ ; в Chrome и Safari вы можете использовать следующий стиль для отключения перетаскивания по умолчанию:

-webkit-user-drag: auto | element | none;

Вы можете попробовать Выбор пользователя для Firefox и IE (10 +):

-moz-user-select: none | text | all | element
-ms-user-select: none | text | all | element

Answer 9

Вы можете добавить следующее к каждому изображению, которое не хотите перетаскивать (внутри тега img):

onmousedown="return false;"

например

img src="Koala.jpg" onmousedown="return false;"

Answer 10

Этот код делает именно то, что вы хотите.Он предотвращает перетаскивание изображения, а также позволяет выполнять любые другие действия, зависящие от события.

$("img").mousedown(function(e){
    e.preventDefault()
});