Как создать jQuery свиток для редактирования CSS?

Question

Во многих примерах CSS есть эта полоса прокрутки для редактирования CSS

альтернативный текст http://img213.imageshack.us/img213/9206/scrollbar.png

Я не могу найти ни одной статьи для этого, может кто-нибудь объяснить, как?

Answer 1

Хорошие примеры использования ползунка jQueryUI вы можете найти здесь: http://jqueryui.com/demos/slider/

Answer 2

ОК, чтобы изменить ползунок CSS:

$( "#slider" ).bind( "slidechange", function(event, ui) {
if (ui.value === 10) {
   $("#idTochange").css('background-color','red') 
//you can add any jQuery code you want to run here when the slider value = 10
} else if (ui.value === 15 {
    $("#idTochange").css('background-color','green')
} else {
   $("#idTochange").css('background-color','blue')
}
console.log(ui.value); //debug output of slider value, use this to change the if values above
});

Проверьте http://jqueryui.com/demos/slider/ для получения подробной информации о том, как создать экземпляр ползунка и как получить доступ к информации, возвращаемой jQueryUI