Styling issue on jQuery scroller

[johndove523]

Hi,

Please see URL http://backstageweb.net/StyleCity/.

I am 90% of the way there styling the jQuery scroller in the text box area of the page, but can't quite get the positioning right. The scrollbar itself is too tall, and I don't know how to make it shorter, but the main issue is that when you pull down on the scrollbar, it goes PAST the end of the text (by quite a bit), and then when you try and go back up, you can only go back up about halfway (and see the latter half of the text). I'd be most grateful if someone can straighten me out on this.

The source site for the jQ scroller is http://manos.malihu.gr/jquery-custom-content-scroller

The suspect code:

#main{
background:url(../images/CityBkgrnd.jpg) no-repeat;
float:left;
width:697px;
height:579px;
margin:0;
padding:0;
}

#borderbox {
border: 2px solid #e4e085;
width:620px;
height:265px;
margin:272px 33px 0 36px;
background:url(../images/TextBkgrnd.png) repeat;
}

#main .customScrollBox {
height:265px;
overflow:hidden;
}

#main .customScrollBox .container {
position:relative;
width:586px;
float:left;
}

#main .customScrollBox .content {
clear:both;
}

#main .dragger_container {
position:relative;
width:2px;
height:220px;
float:left;
margin:10px 0 0 5px;
background:#000;
cursor:pointer;
-moz-border-radius:2px;
-khtml-border-radius:2px;
-webkit-border-radius:2px;
border-radius:2px;
}

#main .dragger {
position:absolute;
width:2px;
height:20px;
background:#999;
text-align:center;
line-height:40px;
color:#666;
overflow:hidden;
cursor:pointer;
-moz-border-radius:2px;
-khtml-border-radius:2px;
-webkit-border-radius:2px;
border-radius:2px;
}

[johndove523]

This is resolved. Sorry, don't know how to flag is as resolved.