David said:Is there something that I can use to prevent the a user from dragging
something, an image for instance. In IE I can use the ondrag = "return
false;", is there a way to achieve the same way with the other browsers?
<img onmousedown="if (event.preventDefault) {
event.preventDefault();
}
return false;"
src="whatever.gif" alt="whatever">
should do.
--
David said:Martin Honnen:
The problem with this is that I have the img tag nested inside a div tag
which needs to be clicked and not have the event cancelled. Any other
ideas?
Martin said:You can still click the <div> outside of the <img>.
David said:so let me clarify what I meant, I have the img tag nest inside a div tag
and the img tag click event NEEDS to bubble and not be cancelled. So is
there any other way to go about cancelling drag? If not, it's no big dealy,
just would be nice.
ASM said:and adding
onmouseup="this.click();"
would it run ?
Ok, so let me clarify what I meant, I have the img tag nest inside a div tag
and the img tag click event NEEDS to bubble and not be cancelled. So is
there any other way to go about cancelling drag?
ASM said:but
IE5.2 (Mac), iCab3 yet allowes to catch (and drag) image ...
Martin said:David wrote:
Well the event continues to bubble, what I suggested is to use
preventDefault() which prevents the default action but not
stopPropagation() which would prevent the event propagation.
Here is a short and simple test case for Mozilla and Opera 8:
<html lang="en">
<head>
<title>difference between preventDefault and stopPropagation</title>
<script type="text/javascript">
function output (tagName, text) {
var element = document.createElement(tagName);
element.appendChild(document.createTextNode(text));
document.body.appendChild(element);
}
</script>
</head>
<body>
<h1>difference between preventDefault and stopPropagation</h1>
<h2>div element whith image which should not allow dragging</h2>
<div id="div1"
style="border: 1px solid green;"
onmousedown="output('p', 'div handles ' + event.type);"
onclick="output('p', 'div handles ' + event.type);"
onmouseup="output('p', 'div handles ' + event.type);">
<p>Here is a div with an img element where the normal drag operation the
browser offers is prevented:
<img src="kiboInside.gif" alt="Kibo inside"
onmousedown="if (event.preventDefault) {
event.preventDefault();
}">
</p>
</div>
<hr>
<h2>debug output of events</h2>
</body>
</html>
You will find that the <div> element containing the <img> will get any
events as events still propagate.
I think in my first answer I had also some return false in the event
handler but that should then not be used.
Want to reply to this thread or ask your own question?
You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.