JSFiddle - React, Tailwind, and code Playground
by rizwanabbasi
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr">
<head>
<title>IE Round Corner</title>
<style type="text/css">
.round {
-moz-border-radius:12px;
-webkit-border-radius:12px;
}
</style>
<script type="text/javascript" src="curvy.corners.trunk.js"></script>
</head>
<body>
<div id="content">
<div id="content-left">
<div id="roundme" class="round" style="width:580px;text-align:center;font-size:48px;background:#eee;border:1px solid #ccc;padding:20px;">IE Round Corner</div>
</div>
</div>
</body>
</html>
JavaScript
function browserdetect() {
var agent = navigator.userAgent.toLowerCase();
this.isIE = agent.indexOf("msie") > -1;
if (this.isIE) {
this.ieVer = /msie\s(\d\.\d)/.exec(agent)[1];
this.quirksMode = !document.compatMode || document.compatMode.indexOf("BackCompat") > -1;
this.get_style = function(obj, prop) {
if (!(prop in obj.currentStyle)) return "";
var matches = /^([\d.]+)(\w*)/.exec(obj.currentStyle[prop]);
if (!matches) return obj.currentStyle[prop];
if (matches[1] == 0) return '0';
// now convert to pixels if necessary
if (matches[2] && matches[2] !== 'px') {
var style = obj.style.left;
var rtStyle = obj.runtimeStyle.left;
obj.runtimeStyle.left = obj.currentStyle.left;
obj.style.left = matches[1] + matches[2];
matches[0] = obj.style.pixelLeft;
obj.style.left = style;
obj.runtimeStyle.left = rtStyle;
}
return matches[0];
};
}
else {
this.ieVer = this.quirksMode = 0;
this.isMoz = agent.indexOf('firefox') !== -1 || ('style' in document.childNodes[1] && 'MozBorderRadius' in document.childNodes[1].style);
this.isSafari = agent.indexOf('safari') != -1;
this.isOp = 'opera' in window;
this.isWebKit = agent.indexOf('webkit') != -1;
this.get_style = function(obj, prop) {
prop = prop.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();
return document.defaultView.getComputedStyle(obj, '').getPropertyValue(prop);
};
}
}
var curvyBrowser = new browserdetect;
/* Force caching of bg images in IE6 */
if (curvyBrowser.isIE) {
try {
document.execCommand("BackgroundImageCache", false, true);
}
catch(e) {};
}
// object that parses border-radius properties for a box
function curvyCnrSpec(selText) {
this.selectorText = selText;
this.tlR = this.trR = this.blR = this.brR = 0;
this.tlu = this.tru = this.blu = this.bru = "";
this.antiAlias = true; // default...