nested scroll areas - inner scroll does not get focus about jquery-slimscroll

Today I ran into the same situation and fixed it. You can find my fork here: https://github.com/9livesdevelopment/jQuery-slimScroll

I also fixed an issue with checking if it's already bound. It used hardcoded values so when you override the defaults the check wouldn't work. Now it contains this code

    //ensure we are not binding it again
    if (me.parent().hasClass(o.wrapperClass))

Anyway,

My solution for the issue was to introduce a special class .slimScrollPriority. This is used to set a global variable called priorityScrollingActive to true. You can find it top of the js file.

To bind them this is what I do:

            $('.slimScroll').slimscroll({
              color: '#000',
              size: '8px',
              width: '100%',
              height: '100%'
            });

            $('.slimScrollPriority').slimscroll({
                  color: '#000',
                  size: '8px',
                  width: '100%',
                  height: '100%',
                  wrapperClass: 'slimScrollDivPriority'
            });   

It works very smooth for me. If you have any questions let me know and I'll see what I can do to help.

Cheers,
René
9Lives Development.

[nsitu]

René, Is it possible to nest/embed multiple vertical scrolling areas within a single horizontal scrolling area? Do you have an example of this?

[nsitu]

I think I've got a solution, by copying your slimScrollPriority method over to the slimScrollHorizontal.js, however, it only works when alwaysVisble = false

I am not sure if it will work with my "hack".

Tbh it isn't the most beautiful solution I've used, but it does the job for our project.
A better solution would be for the slimscroll object to have children and keep track if children are scrolling. Actually block parents :)

Unfortunately I don't have to the time to update the library at the moment :(