Пишу небольшой скрипт полосы прокрутки, используя jQuery. Битый час пытаюсь заставить сам "скроллер" ездить за зажатым курсором, используя mousedown->mousemove.
Трабл заключается в обработке mousemove, который никак нехочет правильно работать более одного раза... тобиш один раз он работает как надо, дальше же вымахивается на право и на лево, - то отказываясь остановится при выходе из зоны "приёма", то отказываясь выполнять прокрутку в обратную сторону.
Вот сам код:
<div id='srcl'><div>
<div class='bar'></div>
</div></div>
<input type='text' name='scr' />
<script>
$(document).ready(function(){
var main = $('#srcl'), bar = main.find('.bar'), ot = $('input[name=scr]')
bar.mousedown(function(){
ot.val('mouse down')
main.mousemove(function(e){
if(e.pageX<main.offset().left || e.pageY<main.offset().top ){
ot.val('OUT!')
//$(this).unbind()
}else{
bar.offset({left:e.pageX-7})}
//ot.val(e.pageX)
})
})
bar.mouseup(function(){
ot.val('mouse up')
main.unbind()
})
/*main.click(function(e){
bar.offset({left:e.pageX})
ot.val('mouse pos: '+e.pageX)
})*/
})
</script>
#srcl {
height:25px;
border:1px solid grey;
width:99%;
overflow:hidden;
clear:both;
margin:25px 0px;
}
#srcl>div {
height:6px;
background: grey;
margin:4px 0px;
width:100%;
position:relative;
top:5px;
vertical-align:middle;
}
#srcl .bar{
position:absolute;
top:-4px;
background: #00FF00;
width:15px;
height:15px;
}
Заранее благодарен