つまみとProgressbarを連動させ、つまみが最後まで到達したとき簡単なアラートを出します。
利便性を考えると当然ではありますが、Sliderで得られる値はピクセルではなくて、Sliderの長さに対する割合です。つまり0-100の値を取得できます。
<body>
<div id="progressBar" style="width:400px; margin-bottom: 30px;"></div>
<div id="sliderWithBar" style="Width: 250px"></div>
<script>
$(function () {
$('#progressBar').progressbar({
//default value
value: 0,
//at the moment reaching the maximum of a progressbar, this is called.
complete: function(event, ui){
alert("Progression done!");
}
});
$('#sliderWithBar').slider({
slide: function(event, ui){
//set value to a progressbar. Value is the rate of a slider length
$('#progressBar').progressbar('option', 'value', ui.value);
}
});
});
</script>
</body>
0 件のコメント:
コメントを投稿