+++ /dev/null
-(function($) {\r
-\r
- //If the UI scope is not available, add it\r
- $.ui = $.ui || {};\r
- \r
- //Make nodes selectable by expression\r
- $.extend($.expr[':'], { shadowed: "(' '+a.className+' ').indexOf(' ui-shadowed ')" });\r
- \r
- $.fn.shadowEnable = function() { if($(this[0]).next().is(".ui-shadow")) $(this[0]).next().show(); }\r
- $.fn.shadowDisable = function() { if($(this[0]).next().is(".ui-shadow")) $(this[0]).next().hide(); }\r
- \r
- $.fn.shadow = function(options) {\r
- \r
- options = options || {};\r
- options.offset = options.offset ? options.offset : 0;\r
- options.opacity = options.opacity ? options.opacity : 0.2;\r
- \r
- return this.each(function() {\r
- \r
- var cur = $(this);\r
- \r
- //Create a shadow element\r
- var shadow = $("<div class='ui-shadow'></div>"); cur.after(shadow);\r
- \r
- //Figure the base height and width\r
- var baseWidth = cur.outerWidth();\r
- var baseHeight = cur.outerHeight();\r
- \r
- //get the offset\r
- var position = cur.position();\r
- \r
- //Append smooth corners\r
- $('<div class="ui-shadow-color ui-shadow-layer-1"></div>').css({ opacity: options.opacity-0.05, left: 5+options.offset, top: 5+options.offset, width: baseWidth+1, height: baseHeight+1 }).appendTo(shadow);\r
- $('<div class="ui-shadow-color ui-shadow-layer-2"></div>').css({ opacity: options.opacity-0.1, left: 7+options.offset, top: 7+options.offset, width: baseWidth, height: baseHeight-3 }).appendTo(shadow);\r
- $('<div class="ui-shadow-color ui-shadow-layer-3"></div>').css({ opacity: options.opacity-0.1, left: 7+options.offset, top: 7+options.offset, width: baseWidth-3, height: baseHeight }).appendTo(shadow);\r
- $('<div class="ui-shadow-color ui-shadow-layer-4"></div>').css({ opacity: options.opacity, left: 6+options.offset, top: 6+options.offset, width: baseWidth-1, height: baseHeight-1 }).appendTo(shadow);\r
- \r
- //If we have a color, use it\r
- if(options.color)\r
- $("div.ui-shadow-color", shadow).css("background-color", options.color);\r
- \r
- //Determine the stack order (attention: the zIndex will get one higher!)\r
- if(!cur.css("zIndex") || cur.css("zIndex") == "auto") {\r
- var stack = 0;\r
- cur.css("position", (cur.css("position") == "static" ? "relative" : cur.css("position"))).css("z-index", "1");\r
- } else {\r
- var stack = parseInt(cur.css("zIndex"));\r
- cur.css("zIndex", stack+1);\r
- }\r
- \r
- //Copy the original z-index and position to the clone\r
- //alert(shadow); If you insert this alert, opera will time correctly!!\r
- shadow.css({\r
- position: "absolute",\r
- zIndex: stack,\r
- left: position.left,\r
- top: position.top,\r
- width: baseWidth,\r
- height: baseHeight,\r
- marginLeft: cur.css("marginLeft"),\r
- marginRight: cur.css("marginRight"),\r
- marginBottom: cur.css("marginBottom"),\r
- marginTop: cur.css("marginTop")\r
- });\r
- \r
- \r
- function rearrangeShadow(el,sh) {\r
- var $el = $(el);\r
- $(sh).css($el.position());\r
- $(sh).children().css({ height: $el.outerHeight()+"px", width: $el.outerWidth()+"px" });\r
- }\r
- \r
- if($.browser.msie) {\r
- //Add dynamic css expressions\r
- shadow[0].style.setExpression("left","parseInt(jQuery(this.previousSibling).css('left'))+'px' || jQuery(this.previousSibling).position().left");\r
- shadow[0].style.setExpression("top","parseInt(jQuery(this.previousSibling).css('top'))+'px' || jQuery(this.previousSibling).position().top");\r
- } else {\r
- //Bind events for good browsers\r
- this.addEventListener("DOMAttrModified",function() { rearrangeShadow(this,shadow); },false);\r
- }\r
-\r
- \r
- });\r
- };\r
- \r
-\r
-})($);
\ No newline at end of file