Работа с DOM

DG.DomEvent

Класс для работы с событиями DOM.

Методы

Метод	Возвращает	Описание
on( <HTMLElement> el, <String> types, <Function> fn, <Object> context? )	this	Добавляет метод fn к цепочкам обработчиков событий DOM, привязанных к элементу el. Вы также можете указать (изменить) контекст вызова обработчика (объект, на который ссылается ключевое слово this внутри обработчика). Также, можно указать несколько типов событий, разделив их пробелами (например: 'click dblclick').
on( <HTMLElement> el, <Object> eventMap, <Object> context? )	this	Добавляет набор пар 'тип/обработчик' в качестве обработчиков событий DOM (например: {click: onClick, mousemove: onMouseMove}).
off( <HTMLElement> el, <String> types, <Function> fn, <Object> context? )	this	Удаляет метод fn из цепочек обработчиков событий DOM, привязанных к элементу el. Если метод не указан, то удаляются все методы, привязанные на текущий момент. Замечание: если методу on передавался контекстный объект, этот же объект должен быть передан и методу off.
off( <HTMLElement> el, <Object> eventMap, <Object> context? )	this	Удаляет набор пар 'тип/обработчик' из цепочек обработчиков событий DOM.
stopPropagation( <DOMEvent> ev )	this	Останавливает всплытие события к родительским элементам. Используется внутри функции-обработчика. Пример: DG.DomEvent.on(div, 'click', function (ev) { DG.DomEvent.stopPropagation(ev); });
disableScrollPropagation( <HTMLElement> el )	this	Добавляет stopPropagation к событиям элемента 'mousewheel'.
disableClickPropagation( <HTMLElement> el )	this	Добавляет stopPropagation к событиям элемента 'click', 'doubleclick', 'mousedown' and 'touchstart'.
preventDefault( <DOMEvent> ev )	this	Предотвращает поведение DOM элемента по умолчанию (например, переход по ссылке указанной в свойстве href элемента a). Используется внутри функции-обработчика.
stop( <DOMEvent> ev )	this	Вызывает одновременно stopPropagation и preventDefault. Используется внутри функции-обработчика.
getMousePosition( <DOMEvent> ev, <HTMLElement> container? )	Point	Возвращает нормализованную позицию мыши из события DOM относительно контейнера или относительно всей страницы, если контейнер не указан.
getWheelDelta( <DOMEvent> ev )	Number	Возвращает нормализованную дельту колесика мыши, в виде вертикального смещения в пикселях (отрицательного, при прокрутке вниз), из события DOM mousewheel. События от устройств, которые не поддерживают точную прокрутку, отображаются на пиксельные координаты так, чтобы дельта прокрутки попадала в диапазон 50-60 пикселей.
addListener( … )	this	Псевдоним для DG.DomEvent.on
removeListener( … )	this	Псевдоним для DG.DomEvent.off

DG.DomUtil

Класс для работы с DOM деревом.

Методы

Метод	Возвращает	Описание
get( <String|HTMLElement> id )	HTMLElement	Возвращает элемент по его id, если параметром была передана строка, либо возвращает элемент непосредственно, если он был передан в качестве параметра.
getStyle( <HTMLElement> el, <String> styleAttrib )	String	Возвращает значение стилей элемента, установленных через атрибут sytle, включая вычисленные значения или значения, указанные с помощью CSS.
create( <String> tagName, <String> className?, <HTMLElement> container? )	HTMLElement	Создает HTML элемент tagName, устанавливает ему значение класса className и опционально добавляет его в элемент container.
remove( <HTMLElement> el )		Удаляет элемент el из элемента контейнера.
empty( <HTMLElement> el )		Удаляет все дочерние элементы из контейнера el.
toFront( <HTMLElement> el )		Перемещает элемент el в конец списка дочерних элементов, чтобы он отображался поверх остальных дочерних элементов контейнера.
toBack( <HTMLElement> el )		Перемещает элемент el в начало списка дочерних элементов, чтобы он отображался перед остальными дочерними элементами контейнера.
hasClass( <HTMLElement> el, <String> name )	Boolean	Возвращает true, если элемент содержит класс name.
addClass( <HTMLElement> el, <String> name )		Добавляет класс name к элементу.
removeClass( <HTMLElement> el, <String> name )		Удаляет класс name из элемента.
setClass( <HTMLElement> el, <String> name )		Устанавливает класс у элемента.
getClass( <HTMLElement> el )	String	Возвращает значение класса элемента.
setOpacity( <HTMLElement> el, <Number> opacity )		Устанавливает прозрачность элемента. Значение opacity должно быть в диапазоне от 0.0 до 1.0.
testProp( <String[]> props )	String|false	Перебирает массив наименований стилей элемента и возвращает первое корректное наименование. Используется с префиксами производителей браузеров и стилями, вроде transform.
setTransform( <HTMLElement> el, <Point> offset, <Number> scale? )		Устанавливает стиль 3D CSS transform элемента el так, чтобы он был смещен на offset пикселей и увеличен/уменьшен в scale раз. Метод не работает, если браузер не поддерживает 3D CSS transforms.
setPosition( <HTMLElement> el, <Point> position )		Изменяет позиционирование элемента el, используя CSS translate или свойства top/left в зависимости от поддержки браузером.
getPosition( <HTMLElement> el )	Point	Возвращает координаты элемента, ранее установленные методом setPosition.
disableTextSelection()		Отключает возможность возникновения selectstart событий DOM, обычно сопутствующих выделению текстового фрагмента на странице. Влияет на поведение всего документа.
enableTextSelection()		Включает возможность возникновения событий DOM selectstart, ранее отключенных DG.DomUtil.disableTextSelection.
disableImageDrag()		Отключает возможность возникновения dragstart событий DOM, обычно сопутствующих перемещению изображения по странице.
enableImageDrag()		Включает возможность возникновения событий DOM dragstart, ранее отключенных DG.DomUtil.disableImageDrag.
preventOutline( <HTMLElement> el )		Делает outline элемента el невидимой.
restoreOutline()		Отменяет эффект DG.DomUtil.preventOutline.

Свойства

Свойство	Тип	Описание
TRANSFORM	String	Название CSS свойства transform с учетом префикса производителя браузера (например, 'webkitTransform' для WebKit).
TRANSITION	String	Название CSS свойства transition с учетом префикса производителя браузера

DG.PosAnimation

Используется внутри библиотеки для анимаций перемещения, используя CSS3 transitions для современных браузеров и таймер для IE6-9.

var fx = new DG.PosAnimation();
fx.run(el, [300, 500], 0.5);

События

Событие	Данные	Описание
start	Event	Вызывается во время старта анимации.
step	Event	Вызывается (периодически) в процессе анимации.
end	Event	Вызывается во время окончания анимации.

Методы

Метод	Возвращает	Описание
run( <HTMLElement> el, <Point> newPos, <Number> duration?, <Number> easeLinearity?)		Запускает анимацию перемещения элемента, полученного через аргумент метода. Дополнительно можно задать продолжительность анимации в секундах (по умолчанию 0.25) и функцию затухания (третий аргумент кубической кривой Безье, по умолчанию 0.5).
stop()		Останавливает ранее запущенную анимацию.

Методы, унаследованные от Evented

DG.Draggable

Класс, с помощью которого можно сделать DOM элемент перетаскиваемым (включая поддержку тач-устройств). Работает только в том случае, если элемент был позиционирован с помошью DG.DomUtil.setPosition.

var draggable = new DG.Draggable(elementToDrag);
draggable.enable();

Свойства

Свойство	Тип	Значение >по умолчанию	Описание
clickTolerance	Number	3	Максимальное количество пикселей, на которое может сдвинуться мышь при нажатой кнопке, чтобы идентифицировать это событике как нажатие (а не начало перетаскивания).

События

Событие	Данные	Описание
down	Event	Вызывается перед началом перетаскивания.
dragstart	Event	Вызывается в момент начала перетаскивания.
predrag	Event	Вызывается в процессе перетаскивания перед каждым обновлением позиции элемента.
dragend	Event	Вызывается в момент окончания перетаскивания.

Методы

Метод	Возвращает	Описание
enable()		Включает возможность перетаскивания.
disable()		Отключает возможность перетаскивания.

Методы, унаследованные от Evented