function addDivs() {
	var imgs = document.getElementsByTagName('IMG');
	var bod = document.getElementsByTagName('BODY')[0];
	var div = document.createElement('DIV');
	div.className = 'positioned';
	div.appendChild(document.createTextNode('positioned DIV'));
	for (var i = 0; i < imgs.length; i++) {
		currDiv = bod.appendChild(div.cloneNode(true));
		currDiv.style.top = getTop(imgs[i]) + imgs[i].height + 'px';
		currDiv.style.left = getLeft(imgs[i]) + 'px';
		currDiv.firstChild.nodeValue = 'image ' + i;
	}
	var divs = document.getElementsByTagName('DIV');
}

window.onload = addDivs;


function getLeft(element) {
	var left = 0, absoluteAncestor = false, computedStyle = (document.defaultView && document.defaultView.getComputedStyle), currentStyle = (element.currentStyle);
//	so long as the element has an positioning context...
	while (element.offsetParent) {
//		add the left offset of the element
		left += element.offsetLeft
//		set the element to the element which provided the positioning context
		element = element.offsetParent;
//		if the element hasLayout (IE-only property)
		if (currentStyle && element.currentStyle.hasLayout && element.nodeName.toLowerCase() != 'html') {
//			add the width of the left border
			left += element.clientLeft;
//			and if it's absolutely positioned, flag that we've got an absolutely positioned ancestor
			if (element.currentStyle['position'] == 'absolute') absoluteAncestor = true;
//		otherwise, if it's a browser that supports computedStyle & the element is absolutely positioned
		} else if (computedStyle && document.defaultView.getComputedStyle(element, "").getPropertyValue('position') == 'absolute') {
//			add the left border of the element
			left += parseInt(document.defaultView.getComputedStyle(element, "").getPropertyValue('border-left-width'));
//			and flag that we've got an absolutely positioned ancestor
			absoluteAncestor = true;
		}
	}
//	if the browser supports currentStyle (i.e. is IE) and we found an absolutely positioned ancestor, add any left margin on the BODY
	if (!absoluteAncestor && currentStyle) return left += document.getElementsByTagName('BODY')[0].offsetLeft;
//	otherwise, if we found an absolutely positioned ancestor and the browser supports computed style add any left border from the BODY
	else if (!absoluteAncestor && computedStyle) return left += parseInt(document.defaultView.getComputedStyle(document.getElementsByTagName('BODY')[0], "").getPropertyValue('border-left-width'));
}

function getTop(element) {
	var top = 0, absoluteAncestor = false, computedStyle = (document.defaultView && document.defaultView.getComputedStyle), currentStyle = (element.currentStyle);
//	so long as the element has an positioning context...
	while (element.offsetParent) {
//		add the top offset of the element
		top += element.offsetTop
//		set the element to the element which provided the positioning context
		element = element.offsetParent;
//		if the element hasLayout (IE-only property)
		if (currentStyle && element.currentStyle.hasLayout && (element.nodeName.toLowerCase() != 'html')) {
//			add the width of the top border
			top += element.clientTop;
//			and if it's absolutely positioned, flag that we've got an absolutely positioned ancestor
			if (element.currentStyle['position'] == 'absolute') absoluteAncestor = true;
//		otherwise, if it's a browser that supports computedStyle & the element is absolutely positioned
		} else if (computedStyle && document.defaultView.getComputedStyle(element, "").getPropertyValue('position') == 'absolute') {
//			add the top border of the element
			top += parseInt(document.defaultView.getComputedStyle(element, "").getPropertyValue('border-top-width'));
//			and flag that we've got an absolutely positioned ancestor
			absoluteAncestor = true;
		}
	}
//	if the browser supports currentStyle (i.e. is IE) and we found an absolutely positioned ancestor, add any top margin on the BODY
	if (!absoluteAncestor && currentStyle) return top += document.getElementsByTagName('BODY')[0].offsetTop;
//	otherwise, if we found an absolutely positioned ancestor and the browser supports computed style add any top border from the BODY
	else if (!absoluteAncestor && computedStyle) top += parseInt(document.defaultView.getComputedStyle(document.getElementsByTagName('BODY')[0], "").getPropertyValue('border-top-width'));
	return top;
}

/* 
		if (-1 != width.indexOf('medium')) alert(
												 width + '\n' + 
												 element.nodeName + ' offsetWidth = ' + element.offsetWidth + '\n' + 
												 element.nodeName + ' offsetLeft = ' + element.offsetLeft + '\n' + 
												 element.nodeName + ' clientWidth = ' + element.clientWidth + '\n' + 
												 element.nodeName + ' clientLeft = ' + element.clientLeft + '\n' + 
												 element.nodeName + ' boundingRect.left = ' + element.getBoundingClientRect().left + 
												 '\nhtml offsetWidth = ' + document.getElementsByTagName('HTML')[0].offsetWidth + 
												 '\nhtml offsetLeft = ' + document.getElementsByTagName('HTML')[0].offsetLeft + 
												 '\nhtml clientLeft = ' + document.getElementsByTagName('HTML')[0].clientLeft + 
												 '\nhtml boundingRect.left = ' + document.getElementsByTagName('HTML')[0].getBoundingClientRect().left)
*/


/*	GET STYLE
	Based on Ryber Nyman's script at:
	http://www.robertnyman.com/2006/04/24/get-the-rendered-style-of-an-element/
	
	gets the current style (computed style in Moz/Safari/etc.) of an element
	
	PARAMETERS
	element - object, element node reference
	rule - string, CSS rule
	
	KNOWN BUGS
	- if a property is set in percentages, ems, etc., IE will return the
	  value in the same unit in which the property was set, where Firefox,
	  Safari, et al will return the value in pixels (that's the difference
	  between computed style & current style)
	
*/
function getStyle(element, rule){
	var value, dashIndex;
	if (document.defaultView && document.defaultView.getComputedStyle) {
		value = document.defaultView.getComputedStyle(element, "").getPropertyValue(rule);
	} else if (element.currentStyle) {
		while(-1 != (dashIndex = rule.indexOf('-'))) {
			rule = rule.substring(0,dashIndex) + rule.substring(dashIndex + 1, dashIndex + 2).toUpperCase() + rule.substring(dashIndex + 2);
		}
		value = element.currentStyle[rule];
    }
    return value;
}