2012-02-13 15 views
0

jscrollpane用のカスタムスクロールバーが作成されました。スクロールバーが最後までスクロールされ、その直前に停止するまで正常に機能しているようです。私はそれが終わりに行くことを望むので、人々はそれ以上スクロールする必要はないことを知っている。私が変更した唯一のCSSスタイルは、jspHorizo​​ntalBar、jspTrack、jspDragです。カスタム水平スクロールバーがトラックの最後に移動しない

/* 
* CSS Styles that are needed by jScrollPane for it to operate correctly. 
* 
* Include this stylesheet in your site or copy and paste the styles below into your stylesheet - jScrollPane 
* may not operate correctly without them. 
*/ 

.jspContainer 
{ 
overflow: hidden; 
position: relative; 
} 

.jspPane 
{ 
position: absolute; 
} 

.jspVerticalBar 
{ 
position: absolute; 
top: 0; 
right: 0; 
width: 16px; 
height: 100%; 
background: red; 
} 

.jspHorizontalBar 
{ 
position: absolute; 
bottom: 0; 
left: 0; 
width: 100%; 
height: 25px; 
background-color: #fff; 
} 

.jspVerticalBar *, 
.jspHorizontalBar * 
{ 
margin: 0; 
padding: 0; 
} 

.jspCap 
{ 
display: none; 
} 

.jspHorizontalBar .jspCap 
{ 
float: left; 
} 

.jspTrack 
{ 
background: #fff; 
position: relative; 
background-image:url(../images/track.gif); 
background-repeat: repeat-x; 
} 


.jspDrag 
{ 
position: relative; 
top: 10px; 
left: 0; 
cursor: pointer; 
background-image:url(../images/move_me.jpg); 
background-repeat:no-repeat; 
border: 0px; 
} 

.jspHorizontalBar .jspTrack, 
.jspHorizontalBar .jspDrag 
{ 
float: left; 
height: 100%; 
} 

.jspArrow 
{ 
background: #50506d; 
text-indent: -20000px; 
display: block; 
cursor: pointer; 
} 

.jspArrow.jspDisabled 
{ 
cursor: default; 
background: #80808d; 
} 

.jspVerticalBar .jspArrow 
{ 
height: 16px; 
} 

.jspHorizontalBar .jspArrow 
{ 
width: 16px; 
float: left; 
height: 100%; 
} 

.jspVerticalBar .jspArrow:focus 
{ 
outline: none; 
} 

.jspCorner 
{ 
background: #eeeef4; 
float: left; 
height: 100%; 
} 

/* Yuk! CSS Hack for IE6 3 pixel bug :(*/ 
* html .jspCorner 
{ 
margin: 0 -3px 0 0; 
} 

答えて

0

簡単な修正。

あなたが持っている - >このオブジェクトの幅がページの端に当たっている

<div class="jspDrag" style="width: 166px; left: 1097px;"> 

。幅を変更すると、オブジェクトはページの最後に移動することが許可されます。

+0

私は要素を調べるためにfirebugを使うと、jspDragと.jspDrag .jspHoverと.jspDrag .jspActiveクラスの幅は420pxですが、これをjScrollPaneのCSSスタイルに追加すると何も変わりません - 私は何ですか?行方不明?ありがとうございました – kas

+0

すみません。 .CSSファイルにオブジェクトのCSSを設定している可能性があります。要素を見ると、要素の幅がインラインになります。これは、要素の幅をJavaScript、PHP、またはHTMLファイルの要素に書き込んでいることを意味します。 – Ohgodwhy

関連する問題