onTransition function

on_transition.js

/**
 * Универсальный обработчик события для transition
 *
 * @param {DOM Element} el DOM-элемент, к которому применяется css transition
 * @param {function} callback Функция, вызываемая после выполнения css transition
 * @param {boolean} isNoFallback По умолчанию в браузерах, не поддерживающих css transition, сразу выполняется
 *                               функция callback(). Если isNoFallback равен true, callback() не выполняется для старых браузеров
 * @param {string} property Название css-свойства, которое подвергается преобразованием (используется, если к DOM-элементу
 *                          применяется несколько css transitions, а callback() вызывать несколько раз не нужно)
 * @param {boolean} autoStartAfterTransition Если равен true, то callback() вызывается сразу, если над DOM-элементом
 *                                           уже было выполнено хотя бы одно css transition
 */
onTransition: function(el, callback, isNoFallback, property, autoStartAfterTransition) {
	var $el = $(el),
		transitionClassEnd = 'js-transitionend',
		transitionEventsName = ['transitionend', 'webkitTransitionEnd', 'oTransitionEnd', 'msTransitionEnd'],
		isTransitionClassEnd = $el.hasClass(transitionClassEnd);

	function transitionCallback(e) {
		callback(e);
		$el.addClass(transitionClassEnd);
	}

	if (callback) {
		if (autoStartAfterTransition && isTransitionClassEnd) {
			callback();
		} else {
			if (window.Modernizr && Modernizr.csstransitions) {
				_.each(transitionEventsName, function(eventName) {
					if (!isTransitionClassEnd) {
						el.addEventListener(eventName, function(e) {
							if (property) {
								(e.propertyName === property) && transitionCallback(e);
							} else {
								transitionCallback(e);
							}
						}, false);
					}
				});
			} else {
				!isNoFallback && transitionCallback();
			}
		}
	}
}