Re: Options is undefined in my class ?

[websam]

Hi there,

I did not know that mootools added px, so thanks for that info ;o)
However I managed to get it working. I had implemented a class that i
do not need and when I removed it from the "Implements:" it worked.
The top of my class looks like this :

var Popup = new Class({
    Implements: [Options, Events],
    options: {
        width: 600,
        height: 350,
        headline: 'Popup',
        overlayId: 'boxOverlay',
        fullpageId: 'boxFullpage',
        color: '#000',
        opacity: 0.2
    },

    initialize: function(options){
          this.setOptions(options);
    },
. . . . .

And then a part of the function that I use to create a popup with an
overlay :

createPopup: function(){
        if ($(this.options.overlayId)) {
            $(this.options.overlayId).setStyle('display', 'block');
        }
        else {
            this.overlay = new Element('div', {
                        'id': this.options.overlayId,
                        'styles': {
                                'position': (Browser.ie6) ? 'absolute' : 
'fixed',
                                'top': '0px',
                                'left': '0px',
                                'width': (Browser.ie6) ? 
(window.getScrollSize().x) :
'100%',
                                'height': '100%',
                                'background-image':'url(g.gif)',
                            'background-color': this.options.color,
                            'opacity': this.options.opacity,
                                'z-index': 800
                        }
                }).inject(document.body);
            }
        }

        if ($(this.options.fullpageId)) {
            $(this.options.fullpageId).setStyle('display', 'block');
        }
        else {
            this.fullpage = new Element('div', {
                        'id': this.options.fullpageId,
                        'styles': {
                                'position': (Browser.ie6) ? 'absolute' : 
'fixed',
                                'top': '0px',
                                'left': '0px',
                                'width': (Browser.ie6) ? 
(window.getScrollSize().x) :
'100%',
                                'height': '100%',
                                'background-image':'url(g.gif)',
                                'z-index': 900
                        }
                }).inject(document.body);
            }
        }

        this.boxContainer = new Element('div', {
            'class': 'boxContainer',
            'styles': {
                'width': this.options.width,
                'display': 'block'
            }
        }).inject($('boxFullpage'));
. . . . .

But could one of you clarify the "this" issue within the 'styles':
{} ?