onmove, onmoveend, onmovestart | NN s.o. IE 5,5 (Win) DOM s.o. |
Remontée: oui; Annulable: non | |
En mode de modification, un élément positionnable configuré pour le glissement reçoit ces événements dans l'ordre suivant: onmovestart (au début du glissement), onmove (à plusieurs reprises pendant le glissement) et onmoveend (au relâchement du bouton de la souris). L'exemple suivant utilise plusieurs événements pour illustrer les scripts du mode de modification de Microsoft Internet Explorer (notez que le mécanisme de glissement d'éléments d'origine ne fonctionne pas bien dans IE 6 si l'élément <!DOCTYPE> pointe sur une DTD en mode de compatibilité avec les normes): <htm> <head> <title>IE 5.5 (Windows) Edit Mode</title> <style type="text/css"> body {font-family:Arial, sans-serif} #myDIV {position:absolute; height:100px; width:300px;} .regular {border:5px black solid; padding:5px; background-color:lightgreen} .moving {border:5px maroon dashed; padding:5px; background-color:lightyellow} .chosen {border:5px maroon solid; padding:5px; background-color:lightyellow} </style> <script type="text/javascript"> // built-in dragging support document.execCommand("2D-position",false,true); // preserve content between modes var oldHTML = ""; // engage static edit environment function editOn( ) { var elem = event.srcElement; elem.className = "chosen"; } // engage special edit-move environment function moveOn( ) { var elem = event.srcElement; oldHTML = elem.innerHTML; elem.className = "moving"; } // display coordinates during drag function trackMove( ) { var elem = event.srcElement; elem.innerHTML = "Element is now at: " + elem.offsetLeft + ", " + elem.offsetTop; } // turn off special edit-move environment function moveOff( ) { var elem = event.srcElement; elem.innerHTML = oldHTML; elem.className = "chosen"; } // restore original environment (wrapper gets onfocusout) function editOff( ) { var elem = event.srcElement; if (elem.id == "wrapper") { elem.firstChild.className = "regular"; } } // initialize event handlers function init( ) { document.body.oncontrolselect = editOn; document.body.onmovestart = moveOn; document.body.onmove = trackMove; document.body.onmoveend = moveOff; document.body.onfocusout = editOff; } </script> </head> <body onload="init( );"> <div id="wrapper" contenteditable="true"> <div id="myDIV" class="regular"> This is a positioned element with some text in it. </div> </div> </body> </html>l |
|
Cibles typiques | |
Un objet LayoutRect XML. |