JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap-responsive.css">
<link rel="stylesheet" href="http://jscrollpane.kelvinluck.com/style/jquery.jscrollpane.css">
<script src="http://jscrollpane.kelvinluck.com/script/jquery.jscrollpane.min.js"></script>
<div id="all"> <div class="span4">
<div class="scroll-pane">
<ul class="unstyled">
<li><a href="/"><img width="100" height="70" src="http://lorempixel.com/100/70/" alt="Article"> This is an article</a></li>
<li><a href="/"><img width="100" height="70" src="http://lorempixel.com/100/70/" alt="Article"> This is an article</a></li>
<li><a href="/"><img width="100" height="70" src="http://lorempixel.com/100/70/" alt="Article"> This is the article</a></li>
<li><a href="/"><img width="100" height="70" src="http://lorempixel.com/100/70/" alt="Article"> This is an article</a></li>
<li><a href="/"><img width="100" height="70" src="http://lorempixel.com/100/70/" alt="Article"> This is an article</a></li>
<li><a href="/"><img width="100" height="70" src="http://lorempixel.com/100/70/" alt="Article"> This is an article</a></li>
<li><a href="/"><img width="100" height="70" src="http://lorempixel.com/100/70/" alt="Article"> This is an article</a></li>
<li><a href="/"><img width="100" height="70" src="http://lorempixel.com/100/70/" alt="Article"> This is an article</a></li>
<li><a href="/"><img width="100" height="70" src="http://lorempixel.com/100/70/" alt="Article"> This is an article</a></li>
<li><a href="/"><img width="100" height="70" src="http://lorempixel.com/100/70/" alt="Article"> This is an article</a></li>
<li><a href="/"><img...
CSS
#all{
width: 100%;
height: 100vh;
overflow: auto;
}
.scroll-pane
{
/* width: 100%;
height: 200px;
overflow: auto;
*/
}
.jspVerticalBar {
background:none;
}
.jspTrack {
background:none;
}
.jspDrag {
background:#ccc;
border-radius:10px;
}
JavaScript
$(function() {
// $('.scroll-pane').jScrollPane();
// $('#all').jScrollPane();
$('#all').jScrollPane({
verticalDragMinHeight: 30,
verticalDragMaxHeight: 50
});
});