Javascript 重新调整剑道范围滑块的大小,同时最小化浏览器窗口

Javascript 重新调整剑道范围滑块的大小,同时最小化浏览器窗口,javascript,c#,jquery,css,asp.net-mvc-4,Javascript,C#,Jquery,Css,Asp.net Mvc 4,我想在最小化浏览器窗口时调整剑道范围滑块的大小 当浏览器窗口最大化剑道范围滑块时,显示如下 当浏览器窗口为最小化剑道范围滑块时,显示如下 所以,我只想这样做,当浏览器窗口最小化时,剑道范围滑块应该是响应的,因此最小化浏览器窗口后,剑道范围滑块应该是全尺寸的 这是我的密码 var id; $(window).resize(function () { clearTimeout(id); id = setTimeout(doneResizing, 5); }); function d

我想在最小化浏览器窗口时调整剑道范围滑块的大小

当浏览器窗口最大化剑道范围滑块时,显示如下

当浏览器窗口为最小化剑道范围滑块时,显示如下

所以,我只想这样做,当浏览器窗口最小化时,剑道范围滑块应该是响应的,因此最小化浏览器窗口后,剑道范围滑块应该是全尺寸的

这是我的密码

 var id;
 $(window).resize(function () {
 clearTimeout(id);
 id = setTimeout(doneResizing, 5);
 });

 function doneResizing() {
 var rangeSlider = $("#slider-range").getKendoRangeSlider();
 rangeSlider.wrapper.css("width", "100%");
 rangeSlider.resize();
 }

在我的代码中,我在树视图的数据绑定事件中绑定了滑块。这样我初始化了两次滑块,但无法调整滑块的大小

为了防止这种双重初始化,我在该元素的getKendoRangeSlider()上检查了null,如果为null,则生成Slider:

var rangeSlider = $("#slider-range").getKendoRangeSlider();

if(rangeSlider == null){
    $("#slider-range").kendoRangeSlider({
        min: 10,
        max: 50,
        orientation: "horizontal",
        smallStep: 1,
        largeStep: 10
    });
}
$(window).on('resize', function () {
  var sliders = $("[data-role='slider']");
  sliders.each(function (index, ele) {
    var slider = $(ele).data("kendoSlider");
    slider.wrapper.css("width", "100%");
    slider.resize();
  });
});

KendoSlider的情况也是如此,在我的代码中,我在TreeView的数据绑定事件中绑定了滑块。这样我初始化了两次滑块,但无法调整滑块的大小

为了防止这种双重初始化,我在该元素的getKendoRangeSlider()上检查了null,如果为null,则生成Slider:

var rangeSlider = $("#slider-range").getKendoRangeSlider();

if(rangeSlider == null){
    $("#slider-range").kendoRangeSlider({
        min: 10,
        max: 50,
        orientation: "horizontal",
        smallStep: 1,
        largeStep: 10
    });
}
$(window).on('resize', function () {
  var sliders = $("[data-role='slider']");
  sliders.each(function (index, ele) {
    var slider = $(ele).data("kendoSlider");
    slider.wrapper.css("width", "100%");
    slider.resize();
  });
});

KendoSlider也是这样的

你的意思是当用户调整窗口大小时,滑块应该在最后一个位置,还是应该始终处于完全大小?看,你有没有收到任何控制台错误?没有,没有任何类型的错误。这里非常重要的是,你把这个代码放在哪里,它会影响还是根本没有影响,因此,只需在
$(窗口)之后添加警报。调整大小(函数(){
并检查当您调整窗口大小时是否调用了您的函数。是的,这一步已经完成,并且也得到了警告。您的意思是当用户调整窗口大小时,滑块应该位于其最后位置还是应该始终为全尺寸?请看,您是否收到任何控制台错误?不,没有任何类型的错误。这里有一个非常重要的问题t你把这个代码放在哪里,它会影响还是根本不影响,所以只需在这个
$(窗口)之后放上警报。调整大小(函数(){
),并检查在调整窗口大小时是否调用了你的函数。是的,这个已经完成了,并且也得到了警报。