Q:

Is it possible to disable navigator(small series) but remains the extensible scroll bar,Highstock

I need to remain the functionality of extensible scroll bar, but I don't need overview navigator. Like :

I need the scroll bar(area 1) to still remains extensible, but remove the navigator(area 2).
This is a design of what I want:

demo you could quickly modify from :
$(function () {

$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?', function (data) {
    // Create the chart
    var chart = $('#container').highcharts('StockChart', {
        rangeSelector : {
            enabled: false 
        }, 
        title: {
            text: null
        },
        navigator: {
            enabled:false,//make it false , but the scroll bar is not extensible
            outlineWidth: 0
        },
        scrollbar: {
            barBackgroundColor: '#ccc',
            barBorderWidth: 0,
            buttonBackgroundColor: '#ccc',
            buttonBorderWidth: 0,
            buttonArrowColor: '#fff',
            buttonBorderRadius: 3,
            rifleColor: '#fff',
            trackBackgroundColor: 'white',
            trackBorderWidth: 1,
            trackBorderColor: '#ccc',
            trackBorderRadius: 3
        },
        series: [{
              type:'areaspline',
            showInLegend: false,
            name: 'AAPL1',
            data: data
        },{
              type:'areaspline',
            showInLegend: false,
            name: 'AAPL2',
            data: data.map(function(d){return [d[0],parseInt(d[1])*2 ]})
        }]
    });
});

});

A:

Scrollbar can not be resized like Navigator, so I think what you really want to use is (2) Navigator and disable (1) Scrollbar. Here is simple example do to do: http://jsfiddle.net/dJbZT/183/
        navigator: {
            enabled:true,
            outlineWidth: 0,
            height: 14,
            maskFill: '#cccccc',
            series: {
                data: [] // empty navigator
            },
            xAxis: {
              labels: {
                y: -20 // move labels outside the navigator
              }
            }
        },

If the navigator should have background, you can add two dummy points for the series, one at the beginning of the original series and one on the end:
              data: [
                [data[0][0], 2],
                [data[data.length - 1][0], 2]
              ]

Then just set color and fillOpacity for a series, to the color you want to achieve, and set yAxis.max below your dummy value (2 in my case). Working demo: http://jsfiddle.net/dJbZT/184/

