Jquery ui Highstock navigator冻结与jquery滑块选项卡

您好，我面临的问题是，当我使用jQueryUI滑块选项卡时，使Highstock图表上的navigator在冻结状态下工作。我无法调试它，因为我找不到任何错误。非常感谢您在调试或错误方面提供的任何帮助。我的代码如下所示：

"<link rel="stylesheet" href="/sites/all/libraries/InterestHighcharts/jquery_slider/styles/jquery.sliderTabs.css"> 
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>
<script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.js'></script>
<?php
print '<div id="mySliderTabs">

<ul>';
for ($i=1;$i<=5;$i++)
{       $j=$i-1;  
    $tab_title=$tab_titles_arr[$j];
    $tab_title_len=strlen($tab_title);
    if($tab_title_len > 7)
    {
    print'<li style="font-size:11px; font-family:Arial,Helvetica,sans-serif;  font-weight:bold;"><a href="#container'.$i.'" title="'.$tab_title.'">'.substr($tab_title,0,6).'</a></li>';
    }
    else
    {
    print'<li style="font-size:11px; font-family:Arial,Helvetica,sans-serif; font-weight:bold;"><a href="#container'.$i.'">'.$tab_title.'</a></li>';
    }

}
print '</ul>';
for($i=1;$i<=5;$i++)
{
print '<div id="container'.$i.'" style="height:375px !important; width:540px !important; margin-left:-10px !important;">Problem reading the charts</div>';
}
print '</div>'; 
?>
<script type="text/javascript">
jQuery.noConflict();
</script>
<script src="http://code.highcharts.com/stock/highstock.js"></script>
<script src="http://code.highcharts.com/stock/modules/exporting.js"></script>
<script type="text/javascript">
(function($) {

     for (i=1;i<=tabs_count;i++)
    {     var j=i-1;
          var flag_test=flagAr[i];

        $('#container'+i).highcharts('StockChart', {
        chart: {
        borderColor: '#000000',
        height:390,
        width:550,
        marginLeft:-3,
        marginTop:13,
        events: {
            load: function() {
               this.renderer.image('http://www.interest.co.nz/sites/all/libraries/InterestHighcharts/images/Interest_logo.gif', 170, 75, 200, 100).add();  // add image(url, x, y, w, h)
            },
            }
        },

    credits: {
        enabled: true,
        itemStyle: {
            cursor: 'pointer',
            color: '#000000',
            fontSize: '11px',
            fontWeight:'bold'
            },
        position: {
            align: 'right',
            x:-60,
            verticalAlign: 'bottom',
            y:-100
        },
        text: 'Source:'+source_arr[j],
        href: source_hyperlink_arr[j]
    },

    rangeSelector : {
            selected : 1,
            inputEnabled : false,
            buttonTheme: { 
            display: 'none',
            },
            labelStyle: {
            color: 'transparent',
            },
            buttons: [{
                type: 'day',
                count: 12, 
                text: '1d'
            }, {
                type: 'week',
                count: 3,
                text: '3w'
            }, {
                type: 'month',
                count: 6,
                text: '6m'
            }, {
                type: 'ytd',
                text: 'YTD'
            }, {
                type: 'year',
                count: 1,
                text: '1y'
            }, {
                type: 'all',
                text: 'All'
            }]
        },



        title : {
            text : chart_title_arr[j],
            x:-220,
            style: {
                      fontFamily:'Arial,Helvetica,sans-serif',
                      fontWeight:'bold'
                    }

        },

        subtitle : {
            text : chart_subtitles_arr[j],
            floating:true, 
            x:-120,
            y:15,
            style: {
                      fontFamily:'Arial,Helvetica,sans-serif'
                    }
            },


        tooltip : {
                 valueDecimals : 2,
                 headerFormat:'<span style="font-size: 10px; margin-left:20px;">{point.key}</span><br/>',
                 pointFormat: '<span style="color:#FF0000; font-weight:bold">{point.y}</span><br/>'
            },

        xAxis:    {
           type: 'datetime', 
           lineWidth: 20,
           gridLineColor:'#FAFFFF', 
           gridLineDashStyle:'Dot', 
            dateTimeLabelFormats: {
            day: '%e-%b',
            week: '%e-%b',
            month: '%b-%y',
            year: '%Y'
        },             

            events: {
            setExtremes: function(e) {

               if (e.trigger === "navigator") {
                    var max=e.max+padding_value;
                    var x=this;
                    setTimeout(function(){ 
                    x.setExtremes(e.min,max);
                    }, 4);
                  }

            }
        },
            max:xpad[i],
            labels: {
            style: {
                   color: 'black',
                   fontSize: '10px',
                   fontWeight:'bold',
                   fontFamily:'Arial,Helvetica,sans-serif',
                    },
            y:3, //to pull x-axis label down

            },

           //showLastLabel:false,
        },
        yAxis:    {
        opposite: true, 
        labels: {
           formatter: function() {
              return Highcharts.numberFormat(this.value,setdecimalpoints(this.value));
            },
            style: {
                   color: 'black',
                   fontSize: '10px',
                   fontWeight:'normal'
                   },
            y:-12, 
            }
        },  
        series : [{
            data : finalAr[i],
            id: 'dataseries',
            lineWidth:3, 
            zIndex:9999,
            shadow:{
                   width:3,
                   color:'#000000',
                   opacity:.7
            },
            lineColor:'#FF0000',
            type : 'area',
            dataGrouping:{  
            dateTimeLabelFormats: {
                day: ['%b-%e,%Y'],
                week: ['%e-%b'],
                month:['%b-%y'],
                year: ['%Y']
        }
        },

           fillColor: {
                    linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1},
                    stops: [
                        [0, Highcharts.getOptions().colors[8]],      
                        [1, 'rgba(255,255,255,0)']
                    ]
                }
            },
            {
            type: 'flags',
            useHTML: true,
            name: 'Flags on series',
            data: JSON.parse("["+flag_test+"]"),
            onSeries: 'dataseries',
            shape: "url(http://www.interest.co.nz/sites/all/libraries/InterestHighcharts/images/balloon.jpg)",
            width : 5,
            y: -33
            }],

    navigator : {
            adaptToUpdatedData: true,
            enabled:true,
            xAxis: { 
            labels:
                    {
                        enabled: false,
                    }
                },
            height: 50,
            margin:-2,
            series: {
            lineColor:'#FF0000',
            type : 'area',
            fillColor : '#FFFFFF'
            }
        },

        scrollbar: {
        liveRedraw: false,   
        },


    });


}

})(jQuery);


    </script>

<script src="/sites/all/libraries/InterestHighcharts/jquery_slider/jquery.sliderTabs.min.js"></script>
 <script type="text/javascript">

 jQuery("#mySliderTabs").sliderTabs();
 //jQuery("div#mySliderTabs").sliderTabs();
</script>   
</div>"

”
jQuery.noConflict（）；
（函数（$）{
对于（i=1；iMy表示歉意，因为它与Highstock库无关。以防万一，任何人都需要它：在自定义javascript文件中调整代码的大小会导致与1.7以上的jQuery冲突，并抛出错误“NS\u error\u FAILURE:组件返回的故障代码：0x80004005（NS\u error\u FAILURE）[nsIDOMWindow.getComputedStyle]return window.getComputedStyle（elem，null）；“我也有同样的问题，但从您的回答中无法理解为了解决这个问题您必须做什么。这意味着什么”调整自定义javascript文件中的代码大小会导致与1.7以上的jQuery冲突“？ThanksHi Mohoch，通过调整大小，我的意思是去除js文件中不必要的制表符间距和空行，您可以使用记事本++查找这些不必要的间距