Accessing plugin options from "sub" function

Hi there!

I'm trying to build a logo slider plugin after I read this tutorial: http://www.learningjquery.com/2007/10/a-plugin-development-pattern

My problem is, that I need to access the options set when the plugin was initialized, and not just the defaults.

Does it make sense?

            $.fn.oSlider = function(options) {

                var options = $.extend({}, $.fn.oSlider.defaults, options);

                return this.each(function() {

                    $wrapper = $('<div class="oslider wrap" />');
                    $obj = $(this);

                    $wrapper.css({
                        'width' : $obj.width() +'px',
                        'height' : $obj.height() +'px'
                    });             
                    $obj.css('width','15000px');

                    $.fn.oSlider.nextImg($obj);
                });

            };

            $.fn.oSlider.defaults = {
                    duration : 1000,
                    delay : 1000                    
            };

            $.fn.oSlider.nextImg = function(obj) {
                alert($.fn.oSlider.options.duration);
                $obj = $(obj);
                $currImg = $obj.find('img:first');
                $obj
                .css('position','absolute')
                .wrap($wrapper)
                .animate({
                    'left' : '-' + $currImg.width() + 'px'

                    },{
                        'duration' : $.fn.oSlider.defaults.duration,
                        'complete' : function() {
                            $obj.css('left','0');
                            $currImg.clone().appendTo($obj);
                            $currImg.remove();
                            setTimeout("$.fn.oSlider.nextImg($obj)",$.fn.oSlider.defaults.delay);
                        }
                });
            };

Oh and this is the HTML code:

<style type="text/css">
            body { background: #333; }
            .oslider.wrap { position: relative; overflow: hidden; }
            div#logos { height: 80px; width: 500px; position: relative; }
            div#logos img { float: left; border: 0; max-height: 80px; display: inline; }

    </style>                
</head>
<body>

    <div id="logos">
        <img src="logo/17.gif" alt="" />
        <img src="logo/6.jpg" alt="" />
        <img src="logo/14.jpg" alt="" />
        <img src="logo/10.gif" alt="" />
        <img src="logo/12.gif" alt="" />
        <img src="logo/19.jpg" alt="" />
        <img src="logo/21.jpg" alt="" />
        <img src="logo/15.gif" alt="" />
        <img src="logo/22.jpg" alt="" />
        <img src="logo/9.gif" alt="" />
        <img src="logo/13.gif" alt="" />
        <img src="logo/11.jpg" alt="" />
    </div>

</body>

ansaurus

tags:

views:

answers:

Accessing plugin options from "sub" function

related questions