some experimental minimal plugin for fix/unfix position of a container inside another container...

jquery.magnetic.js

(function($) {
    $.fn.magnetic = function(options) {

        var obj = this.find(options.selector);
        var initialLeft = parseInt(obj.css('left'));        
        var mainOffset = this.offset().left;        
        var fixAt = (initialLeft - options.left ) + mainOffset;

        this.on('scroll', function() {

            var offset = $(this).scrollLeft();

            if (offset < options.left) {
                obj.css('position', 'absolute').css('left', options.left+'px');
            }
            else if (offset >= options.left && offset < options.right) {
                obj.css('position', 'fixed').css('left', fixAt+'px');
            }
            else {
                obj.css('position', 'absolute').css('left', options.right+'px');
            }

        });
    };
})(jQuery);