fixed水平滚动

　　直接贴代码如下。

　　HTML代码：　　

<div class="wrap">
    <div class="container" id="container">
        <div class="count" id="count"></div>
    </div>
</div>

　　CSS代码：

.wrap {
     width: 1366px;
      height: 900px;
}
 .container {
      width: 900px;
      height: 100%;
      margin: 0 auto;
      background-color: pink;
}
 .count {
      width: 600px;
      height: 20px;
      background-color: red;
      position: fixed;
      bottom: 0;
      left: 0;
}

　　js代码：

(function($){
    $.ScrollFixed = function(el, options){
        var base = this;
        base.$el = $(el);
        base.el = el;
        var target = base.$el; 
        // --------------
        console.log(‘options=‘, options);
        var parentId = options.parentEl;
        var leftPos = $(parentId).offset().left + options.offsetLeft + ‘px‘;
        $(target).css(‘left‘, leftPos);
        // +++++++++++++++
        var original_left = parseInt(target.css(‘left‘));
        var original_right = parseInt(target.css(‘right‘)); 

        var _fix_position = function(){
            if(base.options.fixed == ‘right‘){
                target.css(‘right‘, ($(window).scrollLeft() + $(window).width() - $(document).width() + original_right) + ‘px‘);
            } else if(base.options.fixed == ‘left‘){
                target.css(‘left‘, (original_left - $(window).scrollLeft()) + ‘px‘);
                console.log(original_left);
            }
        }; 

        var windowResize = function(){
            _fix_position();
        }; 

        var windowScroll = function(){
            _fix_position();
        }; 

        base.init = function(){
            base.options = $.extend({}, $.ScrollFixed.defaultOptions, options);
            $(window).resize(windowResize);
            $(window).scroll(windowScroll);
            _fix_position();
            // console.log(base.options.fixed);
        }; 

        base.init();
    }; 

    $.ScrollFixed.defaultOptions = {
        fixed:‘left‘
    }; 

    $.fn.scrollFixed = function(options){
        return this.each(function(){
            (new $.ScrollFixed(this, options));
        });
    };
})(jQuery); 

　　用法：

$(‘#count‘).scrollFixed({fixed:‘left‘, parentEl: ‘#container‘, offsetLeft: 20});

　　说明：

三个参数：其中‘#count’为fixed内容，‘#container’为其祖级（或父级），该用法示例中‘20’为‘#count’相对‘#container’的left值。

fixed:‘left‘为默认项，也可以设置为fixed:‘right‘,具体操作需要根据需求作部分修改。