web/ldt/media/css/border-radius.htc
author wakimd
Wed, 22 Dec 2010 12:01:05 +0100
changeset 25 c8dfd7ea87e5
parent 1 3a30d255c235
permissions -rw-r--r--
Corrections on merge
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
1
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
     1
--Do not remove this if you are using--
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
     2
Original Author: Remiz Rahnas
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
     3
Original Author URL: http://www.htmlremix.com
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
     4
Published date: 2008/09/24
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
     5
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
     6
Changes by Nick Fetchak:
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
     7
- IE8 standards mode compatibility
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
     8
- VML elements now positioned behind original box rather than inside of it - should be less prone to breakage
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
     9
Published date : 2009/11/18
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    10
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    11
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    12
<public:attach event="oncontentready" onevent="oncontentready('v08vnSVo78t4JfjH')" />
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    13
<script type="text/javascript">
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    14
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    15
// findPos() borrowed from http://www.quirksmode.org/js/findpos.html
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    16
function findPos(obj) {
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    17
	var curleft = curtop = 0;
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    18
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    19
	if (obj.offsetParent) {
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    20
		do {
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    21
			curleft += obj.offsetLeft;
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    22
			curtop += obj.offsetTop;
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    23
		} while (obj = obj.offsetParent);
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    24
	}
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    25
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    26
	return({
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    27
		'x': curleft,
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    28
		'y': curtop
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    29
	});
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    30
}
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    31
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    32
function oncontentready(classID) {
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    33
  if (this.className.match(classID)) { return(false); }
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    34
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    35
	if (!document.namespaces.v) { document.namespaces.add("v", "urn:schemas-microsoft-com:vml"); }
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    36
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    37
	this.className = this.className.concat(' ', classID);
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    38
	var arcSize = Math.min(parseInt(this.currentStyle['-moz-border-radius'] ||
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    39
	                                this.currentStyle['-webkit-border-radius'] ||
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    40
	                                this.currentStyle['border-radius'] ||
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    41
	                                this.currentStyle['-khtml-border-radius']) /
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    42
	                       Math.min(this.offsetWidth, this.offsetHeight), 1);
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    43
	var fillColor = this.currentStyle.backgroundColor;
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    44
	var fillSrc = this.currentStyle.backgroundImage.replace(/^url\("(.+)"\)$/, '$1');
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    45
	var strokeColor = this.currentStyle.borderColor;
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    46
	var strokeWeight = parseInt(this.currentStyle.borderWidth);
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    47
	var stroked = 'true';
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    48
	if (isNaN(strokeWeight)) {
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    49
		strokeWeight = 0;
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    50
		strokeColor = fillColor;
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    51
		stroked = 'false';
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    52
	}
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    53
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    54
	this.style.background = 'transparent';
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    55
	this.style.borderColor = 'transparent';
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    56
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    57
	// Find which element provides position:relative for the target element (default to BODY)
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    58
	var el = this;
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    59
	var limit = 100, i = 0;
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    60
	while ((typeof(el) != 'unknown') && (el.currentStyle.position != 'relative') && (el.tagName != 'BODY')) {
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    61
		el = el.parentElement;
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    62
		i++;
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    63
		if (i >= limit) { return(false); }
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    64
	}
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    65
	var el_zindex = parseInt(el.currentStyle.zIndex);
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    66
	if (isNaN(el_zindex)) { el_zindex = 0; }
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    67
	//alert('got tag '+ el.tagName +' with pos '+ el.currentStyle.position);
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    68
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    69
	var rect_size = {
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    70
		'width': this.offsetWidth - strokeWeight,
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    71
		'height': this.offsetHeight - strokeWeight
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    72
	};
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    73
	var el_pos = findPos(el);
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    74
	var this_pos = findPos(this);
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    75
	this_pos.y = this_pos.y + (0.5 * strokeWeight) - el_pos.y;
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    76
	this_pos.x = this_pos.x + (0.5 * strokeWeight) - el_pos.x;
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    77
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    78
	var rect = document.createElement('v:roundrect');
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    79
	rect.arcsize = arcSize +'px';
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    80
	rect.strokecolor = strokeColor;
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    81
	rect.strokeWeight = strokeWeight +'px';
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    82
	rect.stroked = stroked;
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    83
	rect.style.display = 'block';
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    84
	rect.style.position = 'absolute';
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    85
	rect.style.top = this_pos.y +'px';
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    86
	rect.style.left = this_pos.x +'px';
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    87
	rect.style.width = rect_size.width +'px';
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    88
	rect.style.height = rect_size.height +'px';
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    89
	rect.style.antialias = true;
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    90
	rect.style.zIndex = el_zindex - 1;
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    91
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    92
	var fill = document.createElement('v:fill');
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    93
	fill.color = fillColor;
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    94
	fill.src = fillSrc;
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    95
	fill.type = 'tile';
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    96
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    97
	rect.appendChild(fill);
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    98
	el.appendChild(rect);
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
    99
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   100
	var css = el.document.createStyleSheet();
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   101
	css.addRule("v\\:roundrect", "behavior: url(#default#VML)");
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   102
	css.addRule("v\\:fill", "behavior: url(#default#VML)");
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   103
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   104
	isIE6 = /msie|MSIE 6/.test(navigator.userAgent);
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   105
	// IE6 doesn't support transparent borders, use padding to offset original element
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   106
	if (isIE6 && (strokeWeight > 0)) {
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   107
		this.style.borderStyle = 'none';
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   108
		this.style.paddingTop = parseInt(this.currentStyle.paddingTop || 0) + strokeWeight;
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   109
		this.style.paddingBottom = parseInt(this.currentStyle.paddingBottom || 0) + strokeWeight;
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   110
	}
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   111
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   112
	if (typeof(window.rounded_elements) == 'undefined') {
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   113
		window.rounded_elements = new Array();
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   114
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   115
		if (typeof(window.onresize) == 'function') { window.previous_onresize = window.onresize; }
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   116
		window.onresize = window_resize;
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   117
	}
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   118
	this.element.vml = rect;
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   119
	window.rounded_elements.push(this.element);
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   120
}
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   121
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   122
function window_resize() {
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   123
	if (typeof(window.rounded_elements) == 'undefined') { return(false); }
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   124
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   125
	for (var i in window.rounded_elements) {
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   126
		var el = window.rounded_elements[i];
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   127
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   128
		var strokeWeight = parseInt(el.currentStyle.borderWidth);
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   129
		if (isNaN(strokeWeight)) { strokeWeight = 0; }
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   130
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   131
		var parent_pos = findPos(el.vml.parentNode);
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   132
		var pos = findPos(el);
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   133
		pos.y = pos.y + (0.5 * strokeWeight) - parent_pos.y;
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   134
		pos.x = pos.x + (0.5 * strokeWeight) - parent_pos.x;
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   135
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   136
		el.vml.style.top = pos.y +'px';
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   137
		el.vml.style.left = pos.x +'px';
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   138
	}
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   139
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   140
	if (typeof(window.previous_onresize) == 'function') { window.previous_onresize(); }
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   141
}
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   142
</script>
3a30d255c235 First version of API with tests
wakimd
parents:
diff changeset
   143