Как изменить элемент рядом с моим курсором при перетаскивании?

Я пытаюсь включить функцию перетаскивания в свое приложение, использующее библиотеки Google Closure. В частности, я использую класс goog.fx.DragDropGroup:

http://closure-library.googlecode.com/svn/docs/class_goog_fx_DragDropGroup.html

Теперь я пытаюсь, чтобы элемент рядом с моим курсором был каким-то элементом, отличным от источника перетаскивания. Я попытался сделать это в функции обратного вызова моего прослушивателя событий для события dragstart.

myapp.Foo.prototype.dragStart_ = 
    function(e) {
  var dElement = goog.dom.createElement('div');
  dElement.innerHTML = 'This element is not a copy of the drag source element.';
  e.dropTargetItem.element = dElement;
}

Однако прямое изменение свойства element целевого элемента перетаскивания не работает. Фактически, он избавляется от любой копии исходного элемента перетаскивания при перетаскивании.

Как я могу указать другой элемент, который будет отображаться при перетаскивании источника перетаскивания с помощью мыши? Я не хочу, чтобы этот элемент был идентичен источнику перетаскивания.


person dangerChihuahua007    schedule 31.07.2012    source источник


Ответы (1)


Вы можете создать класс группы перетаскивания, который наследуется от goog.fx.DragGroup. Затем переопределите функцию: createDragElement Возвращаемый элемент будет элементом, следующим за указателем мыши.

Пример:

goog.provide('my.DragGroup');

goog.require('goog.fx.DragDropGroup')

/**
 * @constructor
 * @extends {goog.fx.DragDropGroup}
 */
my.DragGroup = function() {
    goog.base(this);
};
goog.inherits(my.DragGroup, goog.fx.DragDropGroup); 

/** @inheritDoc */
my.DragGroup.prototype.createDragElement = function(sourceEl) {
    return goog.dom.createDom('div', null, 'Not a copy of the source El');
}

Надеюсь это поможет

person Joe Heyming    schedule 21.03.2014