Слайдер JQuery перестал работать после обновления до JQuery 1.7.1 - PullRequest
Новая
       19

Слайдер JQuery перестал работать после обновления до JQuery 1.7.1

1 голос
/ 11 января 2012

До обновления до JQuery 1.7.1 вертикальный и горизонтальный слайдер работали нормально. Теперь, когда я обновился до 1.7.1, все перестает работать. Ниже приведены мои коды. 

$("#HorizontalScrollBar").slider({
    change: HorizontalHandleChange,
    slide: HorizontalHandleSlide,
    min: 0,
    max: 100
});

$("#VerticalScrollBar").slider({    
    orientation: "vertical",
    change: VerticalHandleChange,
    slide: VerticalHandleSlide,
    min: -100,
    max: 0
});

Коды для горизонтальных ползунковых ручек 

function HorizontalHandleChange(e, ui) {
    var maxScroll = $(".HorizontalScroll").attr("scrollWidth") - $(".HorizontalScroll").width();
    $(".HorizontalScroll").animate({ 
        scrollLeft: +ui.value * (maxScroll / 100)
    }, 100);    
}

function HorizontalHandleSlide(e, ui) {
    var maxScroll = $(".HorizontalScroll").attr("scrollWidth") - $(".HorizontalScroll").width();
    $(".HorizontalScroll").attr({ 
        scrollLeft: +ui.value * (maxScroll / 100)   
    });
}

и вертикальные ручки ползунка 

function VerticalHandleChange(e, ui) {
    var maxScroll = $(".VerticalScroll").attr("scrollHeight") - $(".VerticalScroll").height();
    $(".VerticalScroll").animate({ 
        scrollTop: -ui.value * (maxScroll / 100)
    }, 100);
}

function VerticalHandleSlide(e, ui) {
    var maxScroll = $(".VerticalScroll").attr("scrollHeight") - $(".VerticalScroll").height();
    $(".VerticalScroll").attr({ 
        scrollTop: -ui.value * (maxScroll / 100)   
    });
}

В любом случае, я надеюсь, что кто-нибудь найдет решение для меня, чтобы мои слайдеры работали с JQuery 1.7.1. Благодаря.

К вашему сведению, ползунки используются на 4 DIV, т.е. Top, MidLeft, MidRight & Bottom, где вертикальный ползунок работает в MidLeft и MidRight, а горизонтальный ползунок работает в MidRight, Top и Bottom, хотя я не думаю, что это может быть причиной проблемы.

1 Ответ

2 голосов
/ 11 января 2012

scrollWidth и scrollHeight - свойства, используйте метод .prop, чтобы получить и установить их. 

function HorizontalHandleChange(e, ui) {
    var maxScroll = $(".HorizontalScroll").prop("scrollWidth") - $(".HorizontalScroll").width();
    $(".HorizontalScroll").animate({
        scrollLeft: +ui.value * (maxScroll / 100)
    }, 100);
}

function HorizontalHandleSlide(e, ui) {
    var maxScroll = $(".HorizontalScroll").prop("scrollWidth") - $(".HorizontalScroll").width();
    $(".HorizontalScroll").attr({
        scrollLeft: +ui.value * (maxScroll / 100)
    });
}

function VerticalHandleChange(e, ui) {
    var maxScroll = $(".VerticalScroll").prop("scrollHeight") - $(".VerticalScroll").height();
    $(".VerticalScroll").animate({
        scrollTop: -ui.value * (maxScroll / 100)
    }, 100);
}

function VerticalHandleSlide(e, ui) {
    var maxScroll = $(".VerticalScroll").prop("scrollHeight") - $(".VerticalScroll").height();
    $(".VerticalScroll").attr({
        scrollTop: -ui.value * (maxScroll / 100)
    });
}

Это изменение пришло из jQuery 1.6, где .attr была разделена на два метода.attr и .prop, где .attr работает с атрибутами, а .prop с свойствами.

...