/** * RUZEE.ShadedBorder 0.6.2 * (c) 2006 Steffen Rusitschka * * RUZEE.ShadedBorder is freely distributable under the terms of an MIT-style license. * For details, see http://www.ruzee.com/ */ var RUZEE = window.RUZEE || {}; RUZEE.ShadedBorder = { create: function(opts) { var isie = /msie/i.test(navigator.userAgent) && !window.opera; var isie6 = isie && !window.XMLHttpRequest; function sty(el, h) { for(k in h) { if (/ie_/.test(k)) { if (isie) el.style[k.substr(3)]=h[k]; } else el.style[k]=h[k]; } } function crdiv(h) { var el=document.createElement("div"); el.className = "sb-gen"; sty(el, h); return el; } function op(v) { v = v<0 ? 0 : v; if (v>0.99999) return ""; return isie ? " filter:alpha(opacity=" + (v*100) + ");" : " opacity:" + v + ';'; } var sr = opts.shadow || 0; var r = opts.corner || 0; var bor = 0; var bow = opts.border || 0; var boo = opts.borderOpacity || 1; var shadow = sr != 0; var lw = r > sr ? r : sr; var rw = lw; var th = lw; var bh = lw; if (bow > 0) { bor = r; r = r - bow; } var cx = r != 0 && shadow ? Math.round(lw/3) : 0; var cy = cx; var cs = Math.round(cx/2); var iclass = r > 0 ? "sb-inner" : "sb-shadow"; var sclass = "sb-shadow"; var bclass = "sb-border"; var edges = opts.edges || "trlb"; if (!/t/i.test(edges)) th=0; if (!/b/i.test(edges)) bh=0; if (!/l/i.test(edges)) lw=0; if (!/r/i.test(edges)) rw=0; var p = { position:"absolute", left:"0", top:"0", width:lw + "px", height:th + "px", ie_fontSize:"1px", overflow:"hidden", margin:"0", padding:"0" }; var tl = crdiv(p); delete p.left; p.right="0"; p.width=rw + "px"; var tr = crdiv(p); delete p.top; p.bottom="0"; p.height=bh + "px"; var br = crdiv(p); delete p.right; p.left="0"; p.width=lw + "px"; var bl = crdiv(p); var tw = crdiv({ position:"absolute", width:"100%", height:th + "px", ie_fontSize:"1px", top:"0", left:"0", overflow:"hidden", margin:"0", padding:"0" }); var t = crdiv({ position:"relative", height:th + "px", ie_fontSize:"1px", margin:"0 "+ rw + "px 0 " + lw + "px", overflow:"hidden", padding:"0" }); tw.appendChild(t); var bw = crdiv({ position:"absolute", left:"0", bottom:"0", width:"100%", height:bh + "px", ie_fontSize:"1px", overflow:"hidden", margin:"0", padding:"0" }); var b = crdiv({ position:"relative", height:bh + "px", ie_fontSize:"1px", margin:"0 "+ rw + "px 0 " + lw + "px", overflow:"hidden", padding:"0" }); bw.appendChild(b); var mw = crdiv({ position:"absolute", top:(-bh)+"px", left:"0", width:"100%", height:"100%", overflow:"hidden", ie_fontSize:"1px", padding:"0", margin:"0" }); function corner(el,t,l) { var w = l ? lw : rw; var h = t ? th : bh; var s = t ? cs : -cs; var dsb = []; var dsi = []; var dss = []; var xp=0; var xd=1; if (l) { xp=w-1; xd=-1; } for (var x=0; x=0 && !finished; --y) { var div = '
'); } else if (d=r-1 && xc>=0 && yc>=0) { var dd = div; if (d>=bor-1) { dd += op((bor-d)*boo); doShadow = true; } else dd += op(boo); dsb.push(dd + '" class="' + bclass + '">'); } // draw inner var dd = div + ' z-index:2;' + (t ? 'background-position:0 -' + (r-yc-1) + 'px;' : 'background-image:none;'); var finish = function() { if (!t) dd = dd.replace(/top\:\d+px/, "top:0px"); dd = dd.replace(/height\:1px/, "height:" + (y+1) + "px"); dsi.push(dd + '" class="' + iclass + '">'); finished = true; }; if (xc < 0 && yc < r || yc < 0 && xc < r) { finish(); } else if (d=0 && yc>=0) { if (d>=r-1) { dd += op(r-d); doShadow = true; dsi.push(dd + '" class="' + iclass + '">'); } else { finish(); } } else doShadow = true; } else doShadow = true; // draw shadow if (sr > 0 && doShadow) { d = Math.sqrt(x*x+y*y); if (d'); } } yp += yd; } xp += xd; } el.innerHTML = dss.concat(dsb.concat(dsi)).join(''); } function mid(mw) { var ds = []; ds.push('
'); var dd = '
'); } for (var x=0; x'); } } if (bow > 0) { var su = ' width:' + bow + 'px;' + op(boo) + '" class="' + bclass + '">'; ds.push(dd + ' left:' + (lw-bor-cx) + 'px;' + su); ds.push(dd + ' right:' + (rw-bor-cx) + 'px;' + su); } mw.innerHTML = ds.join(''); } function tb(el, t) { var ds = []; var h = t ? th : bh; var dd = '
'); } if (y >= bow) { ds.push(dd + (t ? 'top:' : 'bottom:') + (y - bow) + 'px;' + op(boo) + ' height:' + bow + 'px;" class="' + bclass + '">'); } ds.push(dd + (t ? 'background-position-y:0; top:' : 'background-image:none; bottom:') + y + 'px;' + ' height:' + (r+cy+s) + 'px;" class="' + iclass + '">'); el.innerHTML = ds.join(''); } corner(tl, true, true); corner(tr, true, false); corner(bl, false, true); corner(br, false, false); mid(mw); tb(t, true); tb(b, false); needsCloning = false; return { render: function(el) { if (typeof el == 'string') el = document.getElementById(el); if (el.length != undefined) { for (var i=0; i\ .sb, .sbi, .sb *, .sbi * { position:relative; z-index:1; }\ * html .sb, * html .sbi { height:1%; }\ .sbi { display:inline-block; }\ .sb-inner { background:#ddd; }\ .sb-shadow { background:#000; }\ .sb-border { background:#bbb; }\ \ ');