So I'm trying to create a real simple jquery plugin for sliding
screens around in a wizard like format. All this is really doing is
changing the CSS left property.

What I want to be able to do is this

$("#bigmasterframe").screenWizard(optionsObject);

The options object contains things like the size of the frame so it
knows how far to slide.

The trick is I want to be able to do this:

var pageWizard = $("#bigmasterframe").screenWizard(optionsObject);

And then I want to be able to say pageWizard.advance() or
pageWizard.back().

If someone could point me int the right direction on how to format
this type of thing I would be very grateful.

I guess I'm missing a concept here somewhere, because I cannot get
this to work right. I've tried a million incarnations, but in trying
to follow some of the prominent jquery plugin writers, here's what I
have currently:

;(function($) {

$.fn.screenWizard = function (options) {

        var defaultOptions = {
                size : "100",
                duration : 1000,
                defaultLeft : 0
        };

        var settings = $.extend(defaultOptions, options);

        return this.each(function() {
                new $.screenWizard(this, settings);
        });
};

$.screenWizard = function (input, options) {

        var advance = function (){
                current = parseInt($(self).css("left"));
                $(input).animate({left: ((current + options.size)*-1) + "px"},
duration);
        }

        var back = function(){
                current = parseInt($(self).css("left"));
                $(input).animate({left: ((current - options.size)*-1) + "px"},
duration);
        }

        var reset = function(){
                $(input).animate({left: defaultLeft }, duration);
        }

};

})(jQuery);

Best,
Bob

Reply via email to