function ElementDocker( el )
{
    var myself = this;
    var defPar = {};
    var scr = {};
    var def = {element: el};

    this.init = function()
    {
        defPar.element = el.parentNode;
        defPar.elHeight = $( el.parentNode ).height();
        scr = {
            height: $( window ).height(),
            width: $( window ).width()
        };

		var leftOffset = Dimensions.getStyle( el, 'padding-left' ).toInt() + Dimensions.getStyle( el, 'margin-left' ).toInt();
		var topOffset = Dimensions.getStyle( el, 'padding-top' ).toInt() + Dimensions.getStyle( el, 'margin-top' ).toInt();
        def.pageLeft = $( el ).offset().left - leftOffset;
        def.pageTop = $( el ).offset().top;
        def.screenTop = $( el ).offset().top - scr.height;
        def.elHeight = $( el ).height();
        var newHeight = parseInt( defPar.elHeight ) + parseInt( def.elHeight );
        defPar.element.style.height = newHeight+'px';
        el.style.position = 'fixed';
        el.style.left = def.pageLeft+'px';
        var newTop = scr.height - def.elHeight - topOffset;
        el.style.top = newTop +'px';
    }

    function updatePosition()
    {
        if ( scr.height != $( window ).height() )
        {
            myself.resetPosition();
            myself.init();
        }

        if ( $( window ).scrollTop() - def.elHeight > def.screenTop )
        {
            myself.resetPosition();
        }
        else if ( def.element.style.position != 'fixed' )
        {
			var topOffset = Dimensions.getStyle( el, "padding-top" ).toInt() + Dimensions.getStyle( el, "margin-top" ).toInt();

            def.element.style.position = 'fixed';
            el.style.left = def.pageLeft+'px';
            var newTop = scr.height - def.elHeight - topOffset;
            el.style.top = newTop +'px';
        }
    }

    this.resetPosition = function()
    {
        def.element.style.position = 'relative';
        def.element.style.top = 0+'px';
        def.element.style.left = 0+'px';
    }


    $( window ).scroll(
        function ()
        {
            if ( !$( '#'+def.element.id+' .toggleIcon' ).hasClass('icon_minus') )
            {
                updatePosition();
            }
        }
    );

    $( def.element ).mouseup( function(){
        if ( !$( '#'+def.element.id+' .toggleIcon' ).hasClass('icon_minus') )
        {
            myself.resetPosition();
            $.scrollTo('#'+def.element.id, 800, {});
        }
    });

    this.init();

}