Basic jScrollPane demo

HTML

<link rel="stylesheet" href="http://jscrollpane.kelvinluck.com/style/demo.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>
<script src="http://jscrollpane.kelvinluck.com/script/jquery.mousewheel.js"></script>
        <div id="container">
            <div class="scroll-pane">
                
                <p>Hover on this input and you'll be able to scroll</p>
    <input type="text" placeholder="Hover me and scroll">

    <hr>

    <p>Hover on this input and nothing will happen</p>
    <input type="text" placeholder="Hover me and scroll" disabled>
              <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
            </div>
        </div>

CSS

#container
{
    width: 510px;
}
/* Styles specific to this particular page */
.scroll-pane
{
    width: 100%;
    height: 200px;
    overflow: auto;
}
.scroll-pane p
{
    margin: 5px 0;
}
.force-scroll
{
    min-height: 196px;
}

p, input {
  display: block;
  float: none;
}

JavaScript

$(function()
{
    $('.scroll-pane').jScrollPane();
});