JQuery :: Scrollable Div On MouseOver With Custom Scrollbar And Tabs?

I am using a jQuery tab plugin that shows a different content div on click of each tab. It also has a fade in [URL]

In addition, I am using the scroller scripts from Blueshoes (I also tried another, similar scroller script, but run into the same problem: [URL].

What I want to achieve: Have a simple tab function with up to 6 tabs. Each tab content will have a scrollable div with a custom scrollbar that also scrolls on mouseover.

The problem: The tab and scrollbar on initial page load work fine. Once I click on the second or third tab, the tab content loads fine, but the scroller function does not load. I have to click on the tab number again for the scrollbar to appear (I added an onClick event that loads the scrollbar, but this only seems to be activated on the second click, not the first click)

I thought I could just reload the page again with an onClick event on the tabs, but this only reloads the page with the first tab active, and the tab content fade in effect doesn't quite show anymore. In addition, I do not know how to change the script so the tab that was been clicked on (e.g. tab2 or tab3) is active on page reload.

take a look at site, where you can see everything it all in action: [URL]

I'd prefer a solution that loads the scroller script immediately onClick of each tab without reloading the page.

I tried all kinds of possibilities, and I have been working on this for the past 2 days! My Javascript knowledge is just to limited to grasp what needs to happen.

Here is my code, as simplified as possible, with comments in italics:

CSS, JAVASCRIPT and LINKS to JS libraries and plugins:

<style type="text/css">
<!--Begin scroller css -->
.scrollingtext {
position:absolute;

[Code]....