DOM 要素のドラッグ&ドロップには Dragger をイベント登録する
goog.events.listen() 関数で DOM 要素のドラッグアンドドロップ・イベントを登録したい場合、DOM 要素を goog.fx.Dragger インスタンスとして登録する必要があります。
http://closure-library.googlecode.com/svn/docs/class_goog_fx_Dragger.html
また、イベントタイプは通常の goog.events.EventType ではなく、goog.fx.Dragger.EventType に定義されているものを用います。
<!-- html --> <div id="target"></div>
goog.require('goog.dom'); goog.require('goog.events'); goog.require('goog.fx.Dragger'); var $ = goog.dom.getElement; var element = $('target'); var dragger = new goog.fx.Dragger(element, element); // Dragging source // Drag-start goog.events.listen(dragger, goog.fx.Dragger.EventType.START, function(e) { }); // Drag-move goog.events.listen(dragger, goog.fx.Dragger.EventType.DRAG, function(e) { }); // Drag-end goog.events.listen(dragger, goog.fx.Dragger.EventType.END, function(e) { });
ドラッグ・イベントは START > DRAG > END の順に連鎖し、イベントハンドラ関数内で return false; することでイベント連鎖を中断することができます。