views:

156

answers:

3

I have a jQuery draggable container div with a side scroll bar that should not be draggable when I am scrolling up and down. .infotext is the inner div that has the text, contained within #infobody which is set to overflow:auto. I need a way to negate the draggable function on the div when the scrollbar is selected. Here is my code:

$(".lsidebar").draggable({"scroll":false});

 .lsidebar #infobody{
cursor:default;
position:absolute;
width:100%;
overflow:auto;
margin:23px 0 0 0;
z-index:14;
}

   #infobody .infotext{
cursor:default;
position:relative;
width:100%;
z-index:14;
color:#969696;
}
A: 

A workaround to this problem (because for some reason no one is answering my questions as of recently) was to substitute the default browser scrollbar with a jQuery scrollbar known as jScrollPane. Doing this allows me to use the inserted scrollbar ID as a selector to disable draggable...like so:

 $('.jScrollPaneDrag').live('mousedown mouseup', function(e){
     if(e.type=='mousedown'){
         $('.lsidebar').draggable({disable: true});
     }else{
         $('.lsidebar').draggable({"scroll":false});
     };
 });
sadmicrowave