2012-01-11 3 views
1

Перед обновлением до JQuery 1.7.1 работали как вертикальные, так и горизонтальные слайдеры. Теперь, когда я обновился до 1.7.1, все перестает работать. Ниже приведены мои коды.JQuery Slider прекратил работу после обновления до JQuery 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 0,1. Благодарю.

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

+0

С какой версии вы обновили? Получаете ли вы сообщения об ошибках в консоли? – JJJ

+0

Из JQuery 1.5.1 и вообще нет ошибки в консоли. Он просто перестает работать. Оба ползунка появляются, а mousewheel, похоже, работает, но содержимое в DIVs вообще не перемещается/не изменяется. – asyadiqin

ответ

2

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 работ по свойствам.

+0

Ницца! Смена его на prop() работает! Благодарю. – asyadiqin

Смежные вопросы