Should I be using this more, instead of slider ? Am I making any serious no-no's here ? Is there a better design approach I should be taking ? I'm up for any pointers :)

slider = {
                selector : '#slider',
                init : function() {
                        $('#slider').hover(function(e){
                            slider.toggle();
                        });
                    
                    $(document).bind('click', function(e){
                        slider.lock.unlock();
                        slider.state.collapse();
                    });
                    
                    $('#slider').bind('click', function(e){
                        e.stopPropagation();
                        slider.lock.lock();
                    })
                },
                toggle : function() {
                    if (!this.lock.isLocked) {
                        this.state.toggle();
                    }
                },
                lock : {
                    isLocked   : false,
                    lock : function() {
                        this.isLocked = true;
                    },
                    unlock : function() {
                        this.isLocked = false;
                    }
                },
                state : {
                    isExtended : false,
                    toggle : function() {
                        if (this.isExtended===true) {
                            this.collapse();
                        } else {
                            this.extend();
                        }
                    },
                    extend : function() {
                        this.isExtended = true;
                        $('#slider').stop().animate({'left':'-5px'}, 'slow');
                    },
                    collapse : function() {
                        this.isExtended = false;
                        $('#slider').stop().animate({'left':'-210px'}, 'slow');
                    }
                }
            };