+\r
+/**************************************************************\r
+\r
+ Script : Overlay\r
+ Version : 1.2\r
+ Authors : Samuel birch\r
+ Desc : Covers the window with a semi-transparent layer.\r
+ Licence : Open Source MIT Licence\r
+\r
+**************************************************************/\r
+\r
+var Overlay = new Class({\r
+ \r
+ getOptions: function(){\r
+ return {\r
+ colour: '#000',\r
+ opacity: 0.7,\r
+ zIndex: 1,\r
+ container: document.body,\r
+ onClick: Class.empty\r
+ };\r
+ },\r
+\r
+ initialize: function(options){\r
+ this.setOptions(this.getOptions(), options);\r
+ \r
+ this.options.container = $(this.options.container);\r
+ \r
+ this.container = new Element('div').setProperty('id', 'OverlayContainer').setStyles({\r
+ position: 'absolute',\r
+ left: '0px',\r
+ top: '0px',\r
+ width: '100%',\r
+ zIndex: this.options.zIndex\r
+ }).injectInside(this.options.container);\r
+ \r
+ this.iframe = new Element('iframe').setProperties({\r
+ 'id': 'OverlayIframe',\r
+ 'name': 'OverlayIframe',\r
+ 'src': 'javascript:void(0);',\r
+ 'frameborder': 1,\r
+ 'scrolling': 'no'\r
+ }).setStyles({\r
+ 'position': 'absolute',\r
+ 'top': 0,\r
+ 'left': 0,\r
+ 'width': '100%',\r
+ 'height': '100%',\r
+ 'filter': 'progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0)',\r
+ 'opacity': 0,\r
+ 'zIndex': 1\r
+ }).injectInside(this.container);\r
+ \r
+ this.overlay = new Element('div').setProperty('id', 'Overlay').setStyles({\r
+ position: 'absolute',\r
+ left: '0px',\r
+ top: '0px',\r
+ width: '100%',\r
+ height: '100%',\r
+ zIndex: 2,\r
+ backgroundColor: this.options.colour\r
+ }).injectInside(this.container);\r
+ \r
+ this.container.addEvent('click', function(){\r
+ this.options.onClick();\r
+ }.bind(this));\r
+ \r
+ this.fade = new Fx.Tween(this.container, 'opacity').set(0);\r
+ this.position();\r
+ \r
+ window.addEvent('resize', this.position.bind(this));\r
+ },\r
+ \r
+ position: function(){ \r
+ if(this.options.container == document.body){ \r
+ var h = window.getScrollHeight()+'px'; \r
+ this.container.setStyles({top: '0px', height: h}); \r
+ }else{ \r
+ var myCoords = this.options.container.getCoordinates(); \r
+ this.container.setStyles({\r
+ top: myCoords.top+'px', \r
+ height: myCoords.height+'px', \r
+ left: myCoords.left+'px', \r
+ width: myCoords.width+'px'\r
+ }); \r
+ } \r
+ },\r
+ \r
+ show: function(){\r
+ this.fade.start(0,this.options.opacity);\r
+ },\r
+ \r
+ hide: function(){\r
+ this.fade.start(this.options.opacity,0);\r
+ }\r
+ \r
+});\r
+Overlay.implement(new Options);\r
+\r
+/*************************************************************/\r