風格與JQuery嵌套滾動條

Question

我想使用jquery插件或JS庫風格這兩個滾動條。

這是HTML代碼：

<div id="container"> 
    <div class="fixedHeightContainer"> 
     <div class="fixedHeightContent"> 
     Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc ut mi nunc, sit amet fermentum nisi. Nulla vitae felis eros. Pellentesque viverra arcu ac metus lacinia a tincidunt quam sodales. Vestibulum ac velit at nulla tincidunt semper non et orci. Cras a erat eros. Vestibulum vitae felis nulla, at vehicula augue. Nulla eu tellus quam. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin massa augue, fringilla sit amet scelerisque quis, sagittis id erat. Praesent semper nulla quis neque blandit at sagittis felis luctus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vel nisl erat. Phasellus vitae libero erat. Aenean tortor ligula, porta sit amet mattis a, sagittis vel turpis. 
     </div> 
     Phasellus in aliquet quam. Nullam vitae aliquet metus. Praesent libero mi, gravida eu iaculis non, bibendum molestie neque. Integer hendrerit nulla quis arcu bibendum posuere. Pellentesque aliquet nisl quis magna rhoncus eget laoreet dui vehicula. Etiam dapibus dui id lectus gravida vestibulum porttitor dolor ornare. Maecenas vitae risus quis nisl cursus lobortis. Proin accumsan adipiscing varius. 
    </div> 
</div> 

而且CSS代碼：

.fixedHeightContainer { 
    height: 250px; 
    width:250px; 
} 

.fixedHeightContent { 
    height:250px; 
    overflow:auto; 
} 

#container { 
    width:300px; 
    height: 300px; 
    overflow: auto; 
} 

的情況在這個例子進行說明：http://jsfiddle.net/AWtnd/。

我已經嘗試過這兩種解決方案都沒有成功：使用這個jQuery插件稱爲「JQuery的自定義內容滾動」

1. ：http://manos.malihu.gr/jquery-custom-content-scroller/，但不支持嵌套的滾動條。使用jscrollpane但我不能設置「只有垂直滾動條」。

解決此問題的最佳解決方案是什麼？ 謝謝。

Answer 1

試試這個：jQuery custom scrollbar，它工作得很好。