2 /**************************************************************
\r
6 Authors : Samuel birch
\r
7 Desc : Covers the window with a semi-transparent layer.
\r
8 Licence : Open Source MIT Licence
\r
10 **************************************************************/
\r
12 var Overlay = new Class({
\r
14 getOptions: function(){
\r
19 container: document.body,
\r
20 onClick: Class.empty
\r
24 initialize: function(options){
\r
25 this.setOptions(this.getOptions(), options);
\r
27 this.options.container = $(this.options.container);
\r
29 this.container = new Element('div').setProperty('id', 'OverlayContainer').setStyles({
\r
30 position: 'absolute',
\r
34 zIndex: this.options.zIndex
\r
35 }).injectInside(this.options.container);
\r
37 this.iframe = new Element('iframe').setProperties({
\r
38 'id': 'OverlayIframe',
\r
39 'name': 'OverlayIframe',
\r
40 'src': 'javascript:void(0);',
\r
44 'position': 'absolute',
\r
49 'filter': 'progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0)',
\r
52 }).injectInside(this.container);
\r
54 this.overlay = new Element('div').setProperty('id', 'Overlay').setStyles({
\r
55 position: 'absolute',
\r
61 backgroundColor: this.options.colour
\r
62 }).injectInside(this.container);
\r
64 this.container.addEvent('click', function(){
\r
65 this.options.onClick();
\r
68 this.fade = new Fx.Tween(this.container, 'opacity').set(0);
\r
71 window.addEvent('resize', this.position.bind(this));
\r
74 position: function(){
\r
75 if(this.options.container == document.body){
\r
76 var h = window.getScrollHeight()+'px';
\r
77 this.container.setStyles({top: '0px', height: h});
\r
79 var myCoords = this.options.container.getCoordinates();
\r
80 this.container.setStyles({
\r
81 top: myCoords.top+'px',
\r
82 height: myCoords.height+'px',
\r
83 left: myCoords.left+'px',
\r
84 width: myCoords.width+'px'
\r
90 this.fade.start(0,this.options.opacity);
\r
94 this.fade.start(this.options.opacity,0);
\r
98 Overlay.implement(new Options);
\r
100 /*************************************************************/
\r