Is there a way to make an img tag not selectable in a browser?

I have an image in my page and I don't want it to pick up mouse clicks (as in the browsers inherent drag and drop or the drag select where it highlights the image in the browser.)

Is there something I can do to the img or its par开发者_如何转开发ent dom element or the page to make the browser not do anything when I click on the image? I need to use the mousedown for something else, but the browser seems to perform my mousedown event as well as do its own dragging or highlighting, and I don't want it to. Any ideas?

Create a div the same size as the image, and then set the image to be the background of the div.

As recursive said, use a div, and set it's background image to the image you want, e.g.:

<div style="width: 879px; height: 576px; background-image: url(image.png);">

using jquery,

$('img').click(function() {
  return false;
})

Images are draggable by default. To override the browser default behaviour, try:

<img draggable="false"...

Best idea what I get, is to cover <img ... by some transparent <div and bind mousedown action to its :) EDIT: or of course, if u won't play with img, u can use it as a background for your div.