Making an image unselectable in FF

[Jason Carlton]

This is inside of an editable DIV:

<img src="AddEmoticons08052.gif" unselectable="on" selectable="false"
style="-moz-user-select: none;" onselectstart="return false"
ondrag="return false" ondragstart="return false" ondragend="return
false" ondblclick="return false" onfocus="blur()">


The user can STILL double-click the image to select it, then drag it
to resize it. I also tried onDblClick="blur()", but that had no
impact.

I've added every command that I can think of. What am I missing?

 

[Thomas 'PointedEars' Lahn]

This is inside of an editable DIV:

<img src="AddEmoticons08052.gif" unselectable="on" selectable="false"
style="-moz-user-select: none;" onselectstart="return false"
ondrag="return false" ondragstart="return false" ondragend="return
false" ondblclick="return false" onfocus="blur()">

The user can STILL double-click the image to select it, then drag it
to resize it. I also tried onDblClick="blur()", but that had no
impact.

I've added every command that I can think of.

There are no commands.

What am I missing?

Common sense.


PointedEars

 

[Michael Haufe (\TNO\)]

This is inside of an editable DIV:

<img src="AddEmoticons08052.gif" unselectable="on" selectable="false"
style="-moz-user-select: none;" onselectstart="return false"
ondrag="return false" ondragstart="return false" ondragend="return
false" ondblclick="return false" onfocus="blur()">

The user can STILL double-click the image to select it, then drag it
to resize it. I also tried onDblClick="blur()", but that had no
impact.

I've added every command that I can think of. What am I missing?

Not really sure what you're trying to accomplish here. If this is to
protect the image than your endeavor is pointless. Otherwise if its
just for the visual effect you could try making it an image button to
disable mouse interaction in most browsers:

<input
type="image"
src="http://example.com/logo.gif"
onfocus="this.blur()"
oncontextmenu="return false">

example: http://thenewobjective.com/temp/imageSelect.html

 

[Garrett Smith]

This is inside of an editable DIV:

<img src="AddEmoticons08052.gif" unselectable="on" selectable="false" ^?

style="-moz-user-select: none;" onselectstart="return false"
ondrag="return false" ondragstart="return false" ondragend="return
false" ondblclick="return false" onfocus="blur()">


The user can STILL double-click the image to select it, then drag it
to resize it.

To get a better response, I suggest posting:
1) objective of what you are trying to accomplish.
2) reduced, but complete example (so that someone reading can copy-paste
and try).
3) outcome/result

I also tried onDblClick="blur()", but that had no

impact.

I've added every command that I can think of. What am I missing?

I could guess based on looking at your code and suggest something like:

onmousedown="return false;"

.. But I don't know quite what is going on, nor do I understand exactly
what you are trying to do.

 

[David Mark]

This is inside of an editable DIV:

<img src="AddEmoticons08052.gif" unselectable="on" selectable="false"
style="-moz-user-select: none;" onselectstart="return false"
ondrag="return false" ondragstart="return false" ondragend="return
false" ondblclick="return false" onfocus="blur()">

The user can STILL double-click the image to select it, then drag it
to resize it. I also tried onDblClick="blur()", but that had no
impact.

In what browser(s)?

I've added every command that I can think of. What am I missing?

You are missing the onselectend property, -webkit-user-select, -khtml-
user-select styles, etc. And you should feature detect these
properties before trying to use them. Search the archive as we
discussed strategies for this fairly recently.