function Transition(id) {
        this.id = id;
        this.fromElement;
        this.toElement;
        this.visibleElement = 1;
        this.transitionCounter;
        this.whdTransition = null;   
        this.speed = 100;             
        this.onTransitionEnded = null;
    }

    Transition.prototype.BeginTransition = function() {
        this.transitionCounter = 0;
        this.Execute();
    }

    Transition.prototype.EndTransition = function() {
        window.clearTimeout(this.whdTransition);
        this.transitionCounter = 0;
        this.visibleElement = (this.visibleElement==1) ? 2 : 1;
        if(this.onTransitionEnded) {
            this.onTransitionEnded();
        }
            
    }

    Transition.prototype.Execute = function() {
        if(this.transitionCounter == 10) {
            this.ChangeElementOpacity(this.fromElement, 0);
            this.ChangeElementOpacity(this.toElement, 100);
            this.EndTransition();
        } else {
            this.ChangeElementOpacity(this.fromElement, 100-this.transitionCounter*10);
            this.ChangeElementOpacity(this.toElement, this.transitionCounter*10);
            this.transitionCounter += 1;      
            this.whdTransition = window.setTimeout(this.id +'.Execute()', this.speed);
        }                
    }

    Transition.prototype.ChangeElementOpacity = function (element, value) {
         if(value >= 0 || value <= 100) {
            element.style.opacity = value/100;
            element.style.filter = 'alpha(opacity=' + parseInt(value,10).toString() + ')';                    
        }
    }