Forwards events from a floating mask element to the underlying iframe document, except for scrolling

util.js

/**
 * Forwards events from a floating mask element to the underlying document, except for scrolling
 */
var forwardEvents = function(element) {
	var evts = [ 'dblclick', 'click', 'tap', 'doubletap', 'mousedown', 'mouseup' ];

	for(var i = 0, l = evts.length; i < l; i++) {
		element.addEventListener(evts[i], function(event) {
			var s = [0, 0],
				x = Ext.num(event.pageX, event.clientX) - s[0],
				y = Ext.num(event.pageY, event.clientY) - s[1],
				et = event.type,
				target;

			if(et == 'mousedown') {
				element.forwardingSuspended = false;
				element.x = x, element.y = y;
			} else if(et == 'mouseup') {
				if(x != element.x || y != element.y) {
					element.forwardingSuspended = true;
				}
			} else if(!element.forwardingSuspended && element.style.display != 'none') {
				event.stopPropagation();
				element.forwardingSuspended = true;
				element.style.display = 'none';
				target = Ext.get(document.elementFromPoint(x, y));
				element.style.display = 'block';
				if(!target) {
					delete element.forwardingSuspended;
					return;
				} else if(target.dom.contentWindow) {
					var box = target.dom.getBoundingClientRect();
					target = target.dom.contentWindow.document.elementFromPoint(x - box.left, y - box.top);
				} else {
					target = target.dom;
				}
				if(et !== 'mousemove') {
					var eventCopy = document.createEvent("MouseEvents");
					eventCopy.initMouseEvent(event.type, event.bubbles, event.cancelable, event.view, event.detail,
						event.pageX || event.layerX, event.pageY || event.layerY, event.clientX, event.clientY, event.ctrlKey, event.altKey,
						event.shiftKey, event.metaKey, event.button, event.relatedTarget);
					target.dispatchEvent(eventCopy);
				}
				delete element.forwardingSuspended;
			}
		});
	}
}

hi there! how to use this util.js?