144 lines
		
	
	
		
			4.8 KiB
		
	
	
	
		
			Plaintext
		
	
	
	
	
	
		
		
			
		
	
	
			144 lines
		
	
	
		
			4.8 KiB
		
	
	
	
		
			Plaintext
		
	
	
	
	
	
|  | --Do not remove this if you are using-- | ||
|  | Original Author: Remiz Rahnas | ||
|  | Original Author URL: http://www.htmlremix.com | ||
|  | Published date: 2008/09/24 | ||
|  | 
 | ||
|  | Changes by Nick Fetchak: | ||
|  | - IE8 standards mode compatibility | ||
|  | - VML elements now positioned behind original box rather than inside of it - should be less prone to breakage | ||
|  | Published date : 2009/11/18 | ||
|  | 
 | ||
|  | 
 | ||
|  | <public:attach event="oncontentready" onevent="oncontentready('v08vnSVo78t4JfjH')" /> | ||
|  | <script type="text/javascript"> | ||
|  | 
 | ||
|  | // findPos() borrowed from http://www.quirksmode.org/js/findpos.html | ||
|  | function findPos(obj) { | ||
|  | 	var curleft = curtop = 0; | ||
|  | 
 | ||
|  | 	if (obj.offsetParent) { | ||
|  | 		do { | ||
|  | 			curleft += obj.offsetLeft; | ||
|  | 			curtop += obj.offsetTop; | ||
|  | 		} while (obj = obj.offsetParent); | ||
|  | 	} | ||
|  | 
 | ||
|  | 	return({ | ||
|  | 		'x': curleft, | ||
|  | 		'y': curtop | ||
|  | 	}); | ||
|  | } | ||
|  | 
 | ||
|  | function oncontentready(classID) { | ||
|  |   if (this.className.match(classID)) { return(false); } | ||
|  | 
 | ||
|  | 	if (!document.namespaces.v) { document.namespaces.add("v", "urn:schemas-microsoft-com:vml"); } | ||
|  | 
 | ||
|  | 	this.className = this.className.concat(' ', classID); | ||
|  | 	var arcSize = Math.min(parseInt(this.currentStyle['-moz-border-radius'] || | ||
|  | 	                                this.currentStyle['-webkit-border-radius'] || | ||
|  | 	                                this.currentStyle['border-radius'] || | ||
|  | 	                                this.currentStyle['-khtml-border-radius']) / | ||
|  | 	                       Math.min(this.offsetWidth, this.offsetHeight), 1); | ||
|  | 	var fillColor = this.currentStyle.backgroundColor; | ||
|  | 	var fillSrc = this.currentStyle.backgroundImage.replace(/^url\("(.+)"\)$/, '$1'); | ||
|  | 	var strokeColor = this.currentStyle.borderColor; | ||
|  | 	var strokeWeight = parseInt(this.currentStyle.borderWidth); | ||
|  | 	var stroked = 'true'; | ||
|  | 	if (isNaN(strokeWeight)) { | ||
|  | 		strokeWeight = 0; | ||
|  | 		strokeColor = fillColor; | ||
|  | 		stroked = 'false'; | ||
|  | 	} | ||
|  | 
 | ||
|  | 	this.style.background = 'transparent'; | ||
|  | 	this.style.borderColor = 'transparent'; | ||
|  | 
 | ||
|  | 	// Find which element provides position:relative for the target element (default to BODY) | ||
|  | 	var el = this; | ||
|  | 	var limit = 100, i = 0; | ||
|  | 	while ((typeof(el) != 'unknown') && (el.currentStyle.position != 'relative') && (el.tagName != 'BODY')) { | ||
|  | 		el = el.parentElement; | ||
|  | 		i++; | ||
|  | 		if (i >= limit) { return(false); } | ||
|  | 	} | ||
|  | 	var el_zindex = parseInt(el.currentStyle.zIndex); | ||
|  | 	if (isNaN(el_zindex)) { el_zindex = 0; } | ||
|  | 	//alert('got tag '+ el.tagName +' with pos '+ el.currentStyle.position); | ||
|  | 
 | ||
|  | 	var rect_size = { | ||
|  | 		'width': this.offsetWidth - strokeWeight, | ||
|  | 		'height': this.offsetHeight - strokeWeight | ||
|  | 	}; | ||
|  | 	var el_pos = findPos(el); | ||
|  | 	var this_pos = findPos(this); | ||
|  | 	this_pos.y = this_pos.y + (0.5 * strokeWeight) - el_pos.y; | ||
|  | 	this_pos.x = this_pos.x + (0.5 * strokeWeight) - el_pos.x; | ||
|  | 
 | ||
|  | 	var rect = document.createElement('v:roundrect'); | ||
|  | 	rect.arcsize = arcSize +'px'; | ||
|  | 	rect.strokecolor = strokeColor; | ||
|  | 	rect.strokeWeight = strokeWeight +'px'; | ||
|  | 	rect.stroked = stroked; | ||
|  | 	rect.style.display = 'block'; | ||
|  | 	rect.style.position = 'absolute'; | ||
|  | 	rect.style.top = this_pos.y +'px'; | ||
|  | 	rect.style.left = this_pos.x +'px'; | ||
|  | 	rect.style.width = rect_size.width +'px'; | ||
|  | 	rect.style.height = rect_size.height +'px'; | ||
|  | 	rect.style.antialias = true; | ||
|  | 	rect.style.zIndex = el_zindex - 1; | ||
|  | 
 | ||
|  | 	var fill = document.createElement('v:fill'); | ||
|  | 	fill.color = fillColor; | ||
|  | 	fill.src = fillSrc; | ||
|  | 	fill.type = 'tile'; | ||
|  | 
 | ||
|  | 	rect.appendChild(fill); | ||
|  | 	el.appendChild(rect); | ||
|  | 
 | ||
|  | 	var css = el.document.createStyleSheet(); | ||
|  | 	css.addRule("v\\:roundrect", "behavior: url(#default#VML)"); | ||
|  | 	css.addRule("v\\:fill", "behavior: url(#default#VML)"); | ||
|  | 
 | ||
|  | 	isIE6 = /msie|MSIE 6/.test(navigator.userAgent); | ||
|  | 	// IE6 doesn't support transparent borders, use padding to offset original element | ||
|  | 	if (isIE6 && (strokeWeight > 0)) { | ||
|  | 		this.style.borderStyle = 'none'; | ||
|  | 		this.style.paddingTop = parseInt(this.currentStyle.paddingTop || 0) + strokeWeight; | ||
|  | 		this.style.paddingBottom = parseInt(this.currentStyle.paddingBottom || 0) + strokeWeight; | ||
|  | 	} | ||
|  | 
 | ||
|  | 	if (typeof(window.rounded_elements) == 'undefined') { | ||
|  | 		window.rounded_elements = new Array(); | ||
|  | 
 | ||
|  | 		if (typeof(window.onresize) == 'function') { window.previous_onresize = window.onresize; } | ||
|  | 		window.onresize = window_resize; | ||
|  | 	} | ||
|  | 	this.element.vml = rect; | ||
|  | 	window.rounded_elements.push(this.element); | ||
|  | } | ||
|  | 
 | ||
|  | function window_resize() { | ||
|  | 	if (typeof(window.rounded_elements) == 'undefined') { return(false); } | ||
|  | 
 | ||
|  | 	for (var i in window.rounded_elements) { | ||
|  | 		var el = window.rounded_elements[i]; | ||
|  | 
 | ||
|  | 		var strokeWeight = parseInt(el.currentStyle.borderWidth); | ||
|  | 		if (isNaN(strokeWeight)) { strokeWeight = 0; } | ||
|  | 
 | ||
|  | 		var parent_pos = findPos(el.vml.parentNode); | ||
|  | 		var pos = findPos(el); | ||
|  | 		pos.y = pos.y + (0.5 * strokeWeight) - parent_pos.y; | ||
|  | 		pos.x = pos.x + (0.5 * strokeWeight) - parent_pos.x; | ||
|  | 
 | ||
|  | 		el.vml.style.top = pos.y +'px'; | ||
|  | 		el.vml.style.left = pos.x +'px'; | ||
|  | 	} | ||
|  | 
 | ||
|  | 	if (typeof(window.previous_onresize) == 'function') { window.previous_onresize(); } | ||
|  | } | ||
|  | </script> | ||
|  | 
 |