jQuery Scroll Plugin

Question

I just included jQuery jScrollPane plugin in to my page and it seems to be working fine except one small issue. I want to decrease the size(height) of scrollBar tab (where we click to drag the scroll bar up and down). I have attached the current snapshot of it as you can see how long it is. On the example site, it shows up fine.

Src: http://jscrollpane.kelvinluck.com/themes/lozenge/

Note: I am talking about the Dark Colored Area on the snapshot.

alt text

vitch · Accepted Answer · 2010-10-06 07:18:39Z

1

If you want to reduce the size of the "drag" element there are some properties you can pass into the plugin to do so. Please see this example:

http://jscrollpane.kelvinluck.com/drag_size.html

answered Oct 6, 2010 at 7:18

vitch

3,2143 gold badges27 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Julian Young Over a year ago

Good find! Trust me not to look at the instructions :)

Julian Young · Accepted Answer · 2010-10-05 16:01:34Z

0

The height of the dark element is dynamically calculated based on the contents and size of the pane.

Within the jScrollPane js you'd need to adjust the calculation of verticalDragHeight

Search for...

verticalDragHeight = 1 / percentInViewV * verticalTrackHeight;

The trouble is, if you do alter this it could (and probably would) affect the display of the scroll bar under certain circumstances. For example, you wouldn't need a scroll bar if the contents of the pane is smaller than the size of the pane right? Adjusting the verticalDragHeight could effect that determination.

Just in case I misunderstood the question, you are defining the height of your pane right? I.e...

.scroll-pane
{
    height: 200px;
}

answered Oct 5, 2010 at 16:01

Julian Young

9122 gold badges9 silver badges22 bronze badges

3 Comments

t0mcat Over a year ago

Hi Julian, Thanks for the reply. Yes I am defining the height. In my case, the height is 700 px;

t0mcat Over a year ago

You are right, it might affect its use. I thought there might be some easy CSS hack to do this :)

Julian Young Over a year ago

You could extend the height in the javascript by altering the percentInViewV but what'll you notice is the dark coloured part will move outside the confines of the scroll bar either at the top or at the bottom.

Collectives™ on Stack Overflow

jQuery Scroll Plugin

2 Answers 2

1 Comment

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related