| 1 |
/*
|
| 2 |
* jQuery corner plugin
|
| 3 |
*
|
| 4 |
* version 1.92 (12/18/2007)
|
| 5 |
*
|
| 6 |
* Dual licensed under the MIT and GPL licenses:
|
| 7 |
* http://www.opensource.org/licenses/mit-license.php
|
| 8 |
* http://www.gnu.org/licenses/gpl.html
|
| 9 |
*/
|
| 10 |
|
| 11 |
/**
|
| 12 |
* The corner() method provides a simple way of styling DOM elements.
|
| 13 |
*
|
| 14 |
* corner() takes a single string argument: $().corner("effect corners width")
|
| 15 |
*
|
| 16 |
* effect: The name of the effect to apply, such as round or bevel.
|
| 17 |
* If you don't specify an effect, rounding is used.
|
| 18 |
*
|
| 19 |
* corners: The corners can be one or more of top, bottom, tr, tl, br, or bl.
|
| 20 |
* By default, all four corners are adorned.
|
| 21 |
*
|
| 22 |
* width: The width specifies the width of the effect; in the case of rounded corners this
|
| 23 |
* will be the radius of the width.
|
| 24 |
* Specify this value using the px suffix such as 10px, and yes it must be pixels.
|
| 25 |
*
|
| 26 |
* For more details see: http://methvin.com/jquery/jq-corner.html
|
| 27 |
* For a full demo see: http://malsup.com/jquery/corner/
|
| 28 |
*
|
| 29 |
*
|
| 30 |
* @example $('.adorn').corner();
|
| 31 |
* @desc Create round, 10px corners
|
| 32 |
*
|
| 33 |
* @example $('.adorn').corner("25px");
|
| 34 |
* @desc Create round, 25px corners
|
| 35 |
*
|
| 36 |
* @example $('.adorn').corner("notch bottom");
|
| 37 |
* @desc Create notched, 10px corners on bottom only
|
| 38 |
*
|
| 39 |
* @example $('.adorn').corner("tr dog 25px");
|
| 40 |
* @desc Create dogeared, 25px corner on the top-right corner only
|
| 41 |
*
|
| 42 |
* @example $('.adorn').corner("round 8px").parent().css('padding', '4px').corner("round 10px");
|
| 43 |
* @desc Create a rounded border effect by styling both the element and its parent
|
| 44 |
*
|
| 45 |
* @name corner
|
| 46 |
* @type jQuery
|
| 47 |
* @param String options Options which control the corner style
|
| 48 |
* @cat Plugins/Corner
|
| 49 |
* @return jQuery
|
| 50 |
* @author Dave Methvin (dave.methvin@gmail.com)
|
| 51 |
* @author Mike Alsup (malsup@gmail.com)
|
| 52 |
*/
|
| 53 |
(function($) {
|
| 54 |
|
| 55 |
$.fn.corner = function(o) {
|
| 56 |
var ie6 = $.browser.msie && /MSIE 6.0/.test(navigator.userAgent);
|
| 57 |
function sz(el, p) { return parseInt($.css(el,p))||0; };
|
| 58 |
function hex2(s) {
|
| 59 |
var s = parseInt(s).toString(16);
|
| 60 |
return ( s.length < 2 ) ? '0'+s : s;
|
| 61 |
};
|
| 62 |
function gpc(node) {
|
| 63 |
for ( ; node && node.nodeName.toLowerCase() != 'html'; node = node.parentNode ) {
|
| 64 |
var v = $.css(node,'backgroundColor');
|
| 65 |
if ( v.indexOf('rgb') >= 0 ) {
|
| 66 |
if ($.browser.safari && v == 'rgba(0, 0, 0, 0)')
|
| 67 |
continue;
|
| 68 |
var rgb = v.match(/\d+/g);
|
| 69 |
return '#'+ hex2(rgb[0]) + hex2(rgb[1]) + hex2(rgb[2]);
|
| 70 |
}
|
| 71 |
if ( v && v != 'transparent' )
|
| 72 |
return v;
|
| 73 |
}
|
| 74 |
return '#ffffff';
|
| 75 |
};
|
| 76 |
function getW(i) {
|
| 77 |
switch(fx) {
|
| 78 |
case 'round': return Math.round(width*(1-Math.cos(Math.asin(i/width))));
|
| 79 |
case 'cool': return Math.round(width*(1+Math.cos(Math.asin(i/width))));
|
| 80 |
case 'sharp': return Math.round(width*(1-Math.cos(Math.acos(i/width))));
|
| 81 |
case 'bite': return Math.round(width*(Math.cos(Math.asin((width-i-1)/width))));
|
| 82 |
case 'slide': return Math.round(width*(Math.atan2(i,width/i)));
|
| 83 |
case 'jut': return Math.round(width*(Math.atan2(width,(width-i-1))));
|
| 84 |
case 'curl': return Math.round(width*(Math.atan(i)));
|
| 85 |
case 'tear': return Math.round(width*(Math.cos(i)));
|
| 86 |
case 'wicked': return Math.round(width*(Math.tan(i)));
|
| 87 |
case 'long': return Math.round(width*(Math.sqrt(i)));
|
| 88 |
case 'sculpt': return Math.round(width*(Math.log((width-i-1),width)));
|
| 89 |
case 'dog': return (i&1) ? (i+1) : width;
|
| 90 |
case 'dog2': return (i&2) ? (i+1) : width;
|
| 91 |
case 'dog3': return (i&3) ? (i+1) : width;
|
| 92 |
case 'fray': return (i%2)*width;
|
| 93 |
case 'notch': return width;
|
| 94 |
case 'bevel': return i+1;
|
| 95 |
}
|
| 96 |
};
|
| 97 |
o = (o||"").toLowerCase();
|
| 98 |
var keep = /keep/.test(o); // keep borders?
|
| 99 |
var cc = ((o.match(/cc:(#[0-9a-f]+)/)||[])[1]); // corner color
|
| 100 |
var sc = ((o.match(/sc:(#[0-9a-f]+)/)||[])[1]); // strip color
|
| 101 |
var width = parseInt((o.match(/(\d+)px/)||[])[1]) || 10; // corner width
|
| 102 |
var re = /round|bevel|notch|bite|cool|sharp|slide|jut|curl|tear|fray|wicked|sculpt|long|dog3|dog2|dog/;
|
| 103 |
var fx = ((o.match(re)||['round'])[0]);
|
| 104 |
var edges = { T:0, B:1 };
|
| 105 |
var opts = {
|
| 106 |
TL: /top|tl/.test(o), TR: /top|tr/.test(o),
|
| 107 |
BL: /bottom|bl/.test(o), BR: /bottom|br/.test(o)
|
| 108 |
};
|
| 109 |
if ( !opts.TL && !opts.TR && !opts.BL && !opts.BR )
|
| 110 |
opts = { TL:1, TR:1, BL:1, BR:1 };
|
| 111 |
var strip = document.createElement('div');
|
| 112 |
strip.style.overflow = 'hidden';
|
| 113 |
strip.style.height = '1px';
|
| 114 |
strip.style.backgroundColor = sc || 'transparent';
|
| 115 |
strip.style.borderStyle = 'solid';
|
| 116 |
return this.each(function(index){
|
| 117 |
var pad = {
|
| 118 |
T: parseInt($.css(this,'paddingTop'))||0, R: parseInt($.css(this,'paddingRight'))||0,
|
| 119 |
B: parseInt($.css(this,'paddingBottom'))||0, L: parseInt($.css(this,'paddingLeft'))||0
|
| 120 |
};
|
| 121 |
|
| 122 |
if ($.browser.msie) this.style.zoom = 1; // force 'hasLayout' in IE
|
| 123 |
if (!keep) this.style.border = 'none';
|
| 124 |
strip.style.borderColor = cc || gpc(this.parentNode);
|
| 125 |
var cssHeight = $.curCSS(this, 'height');
|
| 126 |
|
| 127 |
for (var j in edges) {
|
| 128 |
var bot = edges[j];
|
| 129 |
// only add stips if needed
|
| 130 |
if ((bot && (opts.BL || opts.BR)) || (!bot && (opts.TL || opts.TR))) {
|
| 131 |
strip.style.borderStyle = 'none '+(opts[j+'R']?'solid':'none')+' none '+(opts[j+'L']?'solid':'none');
|
| 132 |
var d = document.createElement('div');
|
| 133 |
$(d).addClass('jquery-corner');
|
| 134 |
var ds = d.style;
|
| 135 |
|
| 136 |
bot ? this.appendChild(d) : this.insertBefore(d, this.firstChild);
|
| 137 |
|
| 138 |
if (bot && cssHeight != 'auto') {
|
| 139 |
if ($.css(this,'position') == 'static')
|
| 140 |
this.style.position = 'relative';
|
| 141 |
ds.position = 'absolute';
|
| 142 |
ds.bottom = ds.left = ds.padding = ds.margin = '0';
|
| 143 |
if ($.browser.msie)
|
| 144 |
ds.setExpression('width', 'this.parentNode.offsetWidth');
|
| 145 |
else
|
| 146 |
ds.width = '100%';
|
| 147 |
}
|
| 148 |
else if (!bot && $.browser.msie) {
|
| 149 |
if ($.css(this,'position') == 'static')
|
| 150 |
this.style.position = 'relative';
|
| 151 |
ds.position = 'absolute';
|
| 152 |
ds.top = ds.left = ds.right = ds.padding = ds.margin = '0';
|
| 153 |
|
| 154 |
// fix ie6 problem when blocked element has a border width
|
| 155 |
var bw = 0;
|
| 156 |
if (ie6 || !$.boxModel)
|
| 157 |
bw = sz(this,'borderLeftWidth') + sz(this,'borderRightWidth');
|
| 158 |
ie6 ? ds.setExpression('width', 'this.parentNode.offsetWidth - '+bw+'+ "px"') : ds.width = '100%';
|
| 159 |
}
|
| 160 |
else {
|
| 161 |
ds.margin = !bot ? '-'+pad.T+'px -'+pad.R+'px '+(pad.T-width)+'px -'+pad.L+'px' :
|
| 162 |
(pad.B-width)+'px -'+pad.R+'px -'+pad.B+'px -'+pad.L+'px';
|
| 163 |
}
|
| 164 |
|
| 165 |
for (var i=0; i < width; i++) {
|
| 166 |
var w = Math.max(0,getW(i));
|
| 167 |
var e = strip.cloneNode(false);
|
| 168 |
e.style.borderWidth = '0 '+(opts[j+'R']?w:0)+'px 0 '+(opts[j+'L']?w:0)+'px';
|
| 169 |
bot ? d.appendChild(e) : d.insertBefore(e, d.firstChild);
|
| 170 |
}
|
| 171 |
}
|
| 172 |
}
|
| 173 |
});
|
| 174 |
};
|
| 175 |
|
| 176 |
$.fn.uncorner = function(o) { return $('.jquery-corner', this).remove(); };
|
| 177 |
|
| 178 |
})(jQuery);
|
| 179 |
|
| 180 |
// Global killswitch
|
| 181 |
if (Drupal.jsEnabled) {
|
| 182 |
$(document).ready(function() {
|
| 183 |
$('div.block').corner("10px");
|
| 184 |
$('div#mission').corner("10px");
|
| 185 |
});
|
| 186 |
}
|
Parent Directory
| 
Revision Log
| 
Revision Graph