DIV scroll top and bottom using Jquery

This post gives one way to have a scroll bar to a div tag at the top and bottom as shown in the picture.

The high level overview of the implementation:

1. Added an empty div on top the div that has scrolling.2. Set the width same as the below grid or with excluding the vertical scroll bar width (around 18px) if we need not show vertical scroll for the top div
2. Placed an empty table in the top div and width will be same as the table/grid in the bottom div
3. Included a juery file and overridden the scroll event which will synchronize the horizontal scroll bar

Output:

download source: DIV top and bottom scroll sample htm page and source

Note: I have included the complete jquery script in the above source so that the htm page works independently. You may just need to include jquery file instead. Run the source file and it is self explanatory.