Change target from tinyscrollbar to body when reaches top/end of it

Change target from tinyscrollbar to body when reaches top/end of it

Hi everyone!,
This is my very first post here and I hope to have the beginner's luck..

I have a div "list" attached with the tinyscrollbar plugin (PlugIn Page).
In order to accomplished that, I had to create some divs inside of it (divs that the plugin needs, such as thumb, track..).. here is the code:
  1. <div class="list">
  2.              <div class="scrollbar">
  3.                           <div class="track">
  4.                                        <div class="thumb">
  5.                                                     <div class="end"></div>
  6.                                        </div>
  7.                           </div>
  8.              </div>
  9.              <div class="viewport">
  10.                           <div class="overview">
    11.                                         <div class="prop shadow">Scrolled Content</div>
  11.                                         <div class="prop shadow">Scrolled Content</div>
  12.                                         <div class="prop shadow">Scrolled Content</div>
  13.                                         <div class="prop shadow">Scrolled Content</div>
  14.                                         <div class="prop shadow">Scrolled Content</div>
  15.                           </div>
  16.              </div>
  17. </div>
The plugin works great! When the pointer is over the div, the mousewheel controls every up/down scroll movements.

But the problem is, if we reach the top/bottom of "viewport", the scroll gets stuck there and we can't continue scrolling the body unless we get off the div..

Does anyone knows how can I modified this plugin to achieve this?

I'll be truthfully thanked