Vertical scrolling parallax background effect
<h2>Background</h2>

<p>I have been asked to write a script that will create a vertical scrolling parallax background effect for a project. My initial attempt looks a little something like this:</p>

<pre><code>(function($){
    $.fn.parallax = function(options){
        var $$ = $(this);
        offset = $$.offset();
        var defaults = {
            "start": 0,
            "stop": offset.top + $$.height(),
            "coeff": 0.95
        };
        var opts = $.extend(defaults, options);
        return this.each(function(){
            $(window).bind('scroll', function() {
                windowTop = $(window).scrollTop();
                if((windowTop &gt;= opts.start) &amp;&amp; (windowTop &lt;= opts.stop)) {
                    newCoord = windowTop * opts.coeff;
                    $$.css({
                        "background-position": "0 "+ newCoord + "px"
                    });
                }
            });
        });
    };
})(jQuery);

// call the plugin
$('.lines1').parallax({ "coeff":0.65 });
$('.lines1 .lines2').parallax({ "coeff":1.15 });
</code></pre>

<p>This code does give the required effect, but the bind on the scroll event is a real performance drain.</p>

<h2>Question</h2>

<p>Part 1. How could I change my plugin to be more efficient?
Part 2. Are there any resources (books, links, tutorials) I can read to find out more?</p>
