■metaに書きこむJS
http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js
jquery.mousewheel.js
jquery.jscrollpane.min.js

htmlのソース上の追加するscript

$(function(){
	//スクロールをカスタマイズをしたい箇所へ追加のセレクタ
	$('.scroll-pane').jScrollPane();
	
	//ページを読み込んだ時はスクロールバーを透明にする
	$('.jspDrag').css('opacity',0);
	
	//カスタマイズさせたい箇所を囲むボックスに対してhoverを利用して表示・非表示を切り替える
	$('.waku').hover(function(){
	$('.jspDrag').animate({opacity:1});
	},function(){
	$('.jspDrag').animate({opacity:0});
	});
	
});

ひとまずJS関連の設定はこれで完了です。
次にCSS関連を編集していきます。
※今回は縦スクロールのみを適応

今回htmlのソース上に追加したcss

body {background:#F2F2F2; font-size:13px; color:#444;}
ul {list-style-type:none; margin:12px 0 0 0; padding:0;}
li {list-style-type:none; margin-bottom:5px; padding:0 0 0 12px;}

/* hoverの判定要素となるボックス */
.waku {width:120px; margin:20px auto;border-bottom;}

■metaに書きこむCSS
jquery.jscrollpane.css

jquery.jscrollpane.cssを編集をします。
編集箇所は3箇所
.jspVerticalBar
.jspTrack
.jspDrag

/*縦スクロールの設定*/
.jspVerticalBar
{
	position: absolute;
	top: 0;
	right: 0;
	width: 8px; /* バーの横幅を狭く */
	height: 100%;
	/*background: red; 背景色をコメント*/
}

/* バーの背景 */
.jspTrack
{
	/*background: #dde; スクロール部分の背景色をコメント*/
	position: relative;
}

/* バー事態の設定 */
.jspDrag
{
	background: #666; /*スクロール自体の背景色変更*/
	position: relative;
	top: 0;
	left: 0;
	cursor: pointer;
	-webkit-border-radius:8px; /* CSS3 角丸を適応 */
	-moz-border-radius:8px;
	border-radius:8px;
}

最後にbody内の適応させたい箇所にclassを追加すれば完了です。

	■都道府県
	

		
00：北海道
		
01：青森県
		
02：岩手県
		～～～省略～～～