пытаюсь создать сролинг для фитра по цене никак не выходит толком сделать перемещение обьектов, обьект не успевает передвигаться за мышью, и есть косяк с минимальным и максимальным его позиционированием, может кто нить че нить подскажет хотя бы логику верную
вот наработки скрипта:
jQuery.fn.filter = function(options){
var options = jQuery.extend({
// containerID : 'filter',
minCen : '0',
maxCen : '10000',
widthContainer: '195',
heightContainer: '40'
},options);
return this.each(function() {
if(options.widthContainer || options.heightContainer){
jQuery(this).width(options.widthContainer+"px");
jQuery(this).height(options.heightContainer+"px");
};
var g = 'general';
var i = 'internal';
var l = 'left_button';
var r = 'right_button';
var p = 'progress';
var h = jQuery(this).height();
var dx = 0;
var max = 0;
jQuery(this).prepend('<div id="'+g+'" style="height:'+h+'px;border:1px solid;background-color:#DADADA"><div id="'+i+'"><div id="'+p+'"></div><div id="'+l+'" ></div><div id="'+r+'"></div></div></div>');
jQuery('#'+i+' > div').css('position','relative');
jQuery("#"+i).css({height:h/2+'px',top:h/4 ,position:'relative', left:'5px', right:'5px', width:jQuery("#"+i).width()-10+'px'});
jQuery("#"+p).css({height:h/4,top:jQuery("#"+i).height()/4,'background-color':'red'});
jQuery("#"+l).css({float:'left',left:'0px',height:jQuery("#"+i).height(),width:jQuery("#"+i).height()/4,bottom:jQuery("#"+i).height()/2,'background-color':'#000'});
jQuery("#"+r).css({float:'right',right:'0px',height:jQuery("#"+i).height(),width:jQuery("#"+i).height()/4,bottom:jQuery("#"+i).height()/2,'background-color':'#000'});
jQuery("#"+l).mousedown(function(t){
dx=t.clientX - parseInt(jQuery("#"+l).css("left"));
max=parseInt(jQuery("#"+p).css('width'))-((parseInt(jQuery("#"+r).css('right')))+(parseInt(jQuery("#"+r).css('width')))+(parseInt(jQuery("#"+l).css('width'))));
jQuery(this).css("background","#444444");
jQuery(document).bind("mousemove",function(e){
var left = e.clientX - dx;
if(max > left && left > 0){
$("#"+l).css("left",left+'px');
}
});
});
jQuery("#"+g).mouseup(function(){
jQuery(document).unbind('mousemove');
jQuery("#"+l+", #"+r).css("background","#000");
});
});
};
вызов производиться вот так:
$('#filter').filter();
где #filter див в котором будет размещен скролинг
заранее всем благодарен
