movestart | onmovestart event (Internet Explorer)

The topic you requested is included in another documentation set. For convenience, it's displayed below. Choose Switch to see the topic in its original location.

0 out of 1 rated this helpful - Rate this topic

Fires when the object starts to move.

Syntax

HTML Attribute	<element onmovestart = "handler(event)">
Event Property	object.onmovestart = handler;
attachEvent Method	object.attachEvent("onmovestart", handler)
addEventListener Method	object.addEventListener("movestart", handler, useCapture)

Event information

Synchronous	No
Bubbles	No
Cancelable	No

Event handler parameters

pEvtObj [in]: Type: IHTMLEventObj

Standards information

There are no standards that apply here.

Remarks

The onmovestart event fires only when an editable element starts to move.

This event can only be bound to absolutely positioned elements.

Calls the associated event handler if there is one.

To invoke this event, do one of the following:

Start to move the editable object.

The pEvtObj parameter is required for the following interfaces:

Examples

The following example shows how to use the onmovestart event with a movable DIV and have the background color and inner text change when the DIV starts to move.

Code example: http://samples.msdn.microsoft.com/workshop/samples/author/dhtml/refs/onmovestartendEx1.htm



<!DOCTYPE html>
<html>
<head>
<title>Editing events sample page</title>
<script>
// Turn on 2D positioning
document.execCommand("2D-position",false,true);
// Fires when the onmovestart event is fired
function fnHandleMoveStart() {
  var oDiv = event.srcElement
  oDiv.style.backgroundColor = "green";
  oDiv.innerText = "I Started Moving";
}
// Function called when the onmoveend event is fired
function fnHandleMoveEnd() {
  var oDiv = event.srcElement
  oDiv.style.backgroundColor = "red";
  oDiv.innerText = "I Stopped";
}
</script>
</head>
<body onmovestart="fnHandleMoveStart();" onmoveend="fnHandleMoveEnd();">
<div contenteditable="true">
<div style="width:300px;height:100px; color:white; background-color:red; 
position:absolute;">
My DIV</div>
</div>
</body>
</html>

movestart | onmovestart event