Drag and drop events

  • Revision slug: Drag_and_drop_events
  • Revision title: Drag and drop events
  • Revision id: 105474
  • Created:
  • Creator: madarche
  • Is current revision? No
  • Comment Hopefully fixed the link and formatting at the bottom of the page; 5 words added, 11 words removed

Revision Content

{{ Fx_minversion_header("3") }}

Firefox 3 adds two new events that allow you to determine when drag operations begin and end. These events are new in the current working draft of the HTML 5 specification.

{{ Note("The drag and drop event support advertised in the Firefox 3 release notes is not the same as the events described in the Drag and drop section of the HTML 5 working draft. E.g. Firefox 3 does not support the 'drag' event. This support is added in Firefox 3.5, and is documented separately on the page " .. ref("Drag and Drop") .. ".") }}

drag
Sent when a drag operation begins.
dragend
Sent when a drag operation ends.

For more information about drag and drop, see the article Drag and Drop.

You can see an example of these events in action here:

See also

{{ languages( { "es": "es/Eventos_arrastrar_y_soltar", "fr": "fr/\u00c9v\u00e8nements_de_glisser-d\u00e9poser", "ja": "ja/Drag_and_drop_events", "pl": "pl/Zdarzenia_przeci\u0105gania_i_upuszczania" } ) }}

Revision Source

<p>{{ Fx_minversion_header("3") }}</p>
<p>Firefox 3 adds two new events that allow you to determine when drag operations begin and end. These events are new in the current working draft of the HTML 5 specification.</p>
<p>{{ Note("The drag and drop event support advertised in the Firefox 3 release notes is not the same as the events described in the Drag and drop section of the HTML 5 working draft. E.g. Firefox 3 does not support the 'drag' event. This support is added in Firefox 3.5, and is documented separately on the page " .. ref("Drag and Drop") .. ".") }}</p>
<dl> <dt> <code>drag</code> </dt><dd>Sent when a drag operation begins.</dd> <dt> <code>dragend</code> </dt><dd>Sent when a drag operation ends.</dd>
</dl>
<p>For more information about drag and drop, see the article <a href="/en/Drag_and_Drop" title="en/Drag_and_Drop">Drag and Drop</a>.</p>
<p>You can see an example of these events in action here:</p>
<ul><a class="external" href="/samples/dragdrop/dragevents.txt" title="samples/dragdrop/dragevents.txt">View source</a> <a class="external" href="/samples/dragdrop/dragevents.html" title="samples/dragdrop/dragevents.html">View example</a></ul> <h3 id="See_also" name="See_also">See also</h3>
<ul>
<li> {{ endnote("Drag and Drop") }}: <a href="/en/Drag_and_Drop" title="en/Drag_and_Drop">Drag and Drop</a></li> <li><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/#dnd">HTML 5 working draft: Drag and drop</a></li> <li>{{ Interface("nsIDragService") }}</li> </ul> <p>{{ languages( { "es": "es/Eventos_arrastrar_y_soltar", "fr": "fr/\u00c9v\u00e8nements_de_glisser-d\u00e9poser", "ja": "ja/Drag_and_drop_events", "pl": "pl/Zdarzenia_przeci\u0105gania_i_upuszczania" } ) }}</p>
Revert to this revision