2011-12-10 32 views
3

私はjqueryの初心者です。私は、このフォーラムで最も簡単な質問さえも、私の理解の中で進歩する傾向があることを知っていますが、私は他のところで私の特定の問題に対する解決策を見つけることに迷っています。私はここで約1時間を探しましたが、私は問題に本当の解決策を見つけることができません(それは主に経験不足なので)。jScrollPaneの基本的なスタイル

jScrollPaneに関連するすべてのファイルをダウンロードしました。「スクリプト」と「スタイル」フォルダを自分のサイトのフォルダにドロップしました(私のサイトはローカルです)。私は単にスクロールバーの幅を狭くして別の色にしたいと思っています。そのスクロールバーの仕組みを正確に把握できないようです。

<head> 
<script type="text/javascript"> 

$(document).ready(function() 
{ 
$('.scroll-pane').jScrollPane(
{showArrows: true 
    }); 
}); 

</script> 
</head> 

ショーアローのアクションは機能しますが、CSS(幅、色)を使用した場合の予想通りの変更はできません。 jquery.jscrollpane.cssには、操作したいセレクタのクラスが含まれていますが、それらを適用する方法はわかりません。私のHTMLで表示される唯一のセレクタは次のとおりです。私はそれがスタイルすることができるように私のHTMLに、例えば.jspVerticalBarを持参する方法がわからない

<div class="scroll-pane"> 

。私が知っていることは、前に言及したdivのクラスとしてそれを使うことです。それは間違ったアプリケーションであることがわかります。

願わくは私の質問を明確にしました。私が確信していることを説明する時間をとることは、非常に明白なルーキーエラーです。

あなたはまだ答えを探しているなら、私はちょうどあなたの質問に遭遇しますが、き

答えて

1

...

側JScrollPaneのスタイリングは、CSSファイル「jquery.jscrollpane.css」です。トラックの幅を設定するスタイルは、 ".jspVerticalBar" & ".jspHorizo​​ntalBar"です。 矢印を使用している場合は、トラックにも影響します。 ".jspVerticalBar .jspArrow" & ".jsp水平方向の.jspArrow"。 これらすべてのデフォルトの「px」は「16px」です。トラックを狭くするには、4つの値を同じ値に変更する必要があります。

色を変更するには、背景色を設定します。私はロゼンジスタイルを使用していますので、 "jquery.jscrollpane.css"自体を変更してはいけません。ロゼンジCSSのみ。

jquery UI(アイコンの四角形のpng)の矢印を使用している場合は、「.jspArrowUp」などの座標を調整して矢印の位置を変更する必要があります。