Forum user: ajay

I have a scrollbar defined.
CSS is defined as:
/* root element for scrollable items */
div.scrollable div.items {
position:absolute;

/* this time we have very large space for the height */
height:20000em;
}

Here if I remove height, scrollbar shows correctly.(like for 100 items its height is large and for 5 items is small and no scrollbar is displayed) , but mousewheel does not work :(

If the height is set as above, mousewheel works but height is not set correctly...

Please help...

Now that scrollbars are correctly displaying/working, mousewheel stopped working...
$("div.scrollable").scrollable({vertical:true,
size: 3
}).mousewheel();
If i undo the removed section in css, mousewheel starts working again... Strange..
Can anyone explain why the position and height set for items and scrollable as above?

Thanks in advance..

ok issue resolved...

removed the css defs below and it worked fine...
I guess earlier it was setting the height as fixed irrespective of number of items in the scrollable...

/* root element for scrollable items */
div.scrollable div.items {
position:absolute;

/* this time we have very large space for the height */
height:20000em;
}

I have initialised through a single call only... but as I mentioned each scrollable shows scrollbar as if total items in the scrollable are sum of all items in different scrollables...
Not sure if some bug in the library..I have checked many times and everything seems correct...

Awesome....

one more problem...

I have multiple scrollables as below...

<div id="main1">
	<div id="s1" class="scrollable">
		<div class="items">
			<div class="item">
			</div>
			<div class="item">
			</div>
			<div class="item">
			</div>
		</div>
	</div>
</div>
<div id="main2">
	<div id="s2" class="scrollable">
		<div class="items">
			<div class="item">
			</div>
			<div class="item">
			</div>
			<div class="item">
			</div>
		</div>
	</div>
</div>

It's initialising the scrollables with incorrect item size.
For both scrollable, the size comes out to be sum of both...
So if s1 has 5 items and s2 has 3 items, both scrollables show the scroll bars as if both have 8 items...Navigating at the end of items does not correctly reflect in the scrollbar...

Do I need to initialise all scrollables differently giving them different class and ids?

I have multiple tabs initialised through single statement like below.

$("div.scrollable").scrollable({
vertical:true,
size: 3 ,
onSeek: function(event, i) {

//different param to be passed based on which scrollable it is called for
somefunc(param);

}
);

Can it be done? Can I get the div id of the scrollable for which onSeek is called?