JavaScript DHTML/Document/Drag Drop

Материал из Web эксперт
Перейти к: навигация, поиск

"dragDrop()" Example

   <source lang="html4strict">

<html> <body> <script language="JavaScript"> function function1() { 

   document.all.sourceObject.dragDrop()
   var m = document.all.sourceObject.dragDrop()
   alert(m+".\nDrag operation is not yet completed")

} </script>

<input id="sourceObject" size=50 value="The (whole or part) text to drag">

Drop selected text into the following text field.

<input id="targetObject" size=50 value="Drag destination element">

</body> </html> 


     </source>


"dropEffect" Example

   <source lang="html4strict">

<html> <head> <script language="JavaScript"> function transferDrop() { 

   window.event.srcElement.innerText = window.event.dataTransfer.getData("text");
   window.event.returnValue = false;

} function transferDrag() { 

   window.event.dataTransfer.dropEffect = "move"; 
   window.event.returnValue = false;

} </script> </head> <body bottommargin="150">

Highlight text in this paragraph and drag it to the text area bellow

<textarea id="myTarget" 

         ondrop="transferDrop();" 
         ondragover="window.event.returnValue = false;" 
         ondragenter="transferDrag();">

</textarea> 


     </source>


"effectAllowed" Example

   <source lang="html4strict">

<html> <head> <script language="JavaScript"> function transferDrop() { 

   window.event.srcElement.innerText = window.event.dataTransfer.getData("text");
   window.event.returnValue = false;

} function transferDrag() { 

   window.event.dataTransfer.dropEffect = "move"; 
   window.event.returnValue = false;

} </script> </head> <body bottommargin="150">

Highlight text in this paragraph and drag it to the text area bellow

<textarea id="myTarget" 

         ondrop="transferDrop();" 
         ondragover="window.event.returnValue = false;" 
         ondragenter="transferDrag();">

</textarea> 


     </source>
Источник — «http://wbex.ru/index.php?title=JavaScript_DHTML/Document/Drag_Drop&oldid=1901»