在jscrollpane中，滚动不起作用

Objective:: want to make a registration pop page with vertical scroll bar by using jScrollPane.

Issue:: vertical scrollbar is not moving

HTML code::

<div id="register" class="wpml-content jspScrollable" >
    <div class="jspContainer" style="width: 100%; height: 370px;">
        <div class="jspPane">
            <form action="register" method="post" id="form" class="group" name="loginform" >
              <!-- code for registration-->
            </form>
        </div>
        <div class="jspVerticalBar">
            <div class="jspCap jspCapTop"></div>
            <div class="jspTrack" style="height: 200px;">
                    <div class="jspDrag" style="height: 77px; top: 0px;">
                            <div class="jspDragTop"></div>
                            <div class="jspDragBottom"></div>
                    </div>
            </div>
            <div class="jspCap jspCapBottom"></div>
        </div>
    </div>
</div>

JS code::

<script type="text/javascript" src="/plugins/jScrollPane-master/script/jquery.jscrollpane.js"></script>
<script type="text/javascript" src="/plugins/jScrollPane-master/script/jquery.jscrollpane.min.js"></script>
<script type="text/javascript" src="/plugins/jScrollPane-master/script/jquery.mousewheel.js"></script>
<script type="text/javascript" src="/plugins/jScrollPane-master/script/mwheelIntent.js"></script>

jQuery(document).ready(function(){
 $('#register').jScrollPane();
});

CSS code::

.jspVerticalBar {
   width: 8px;
      background-color: #ededed;
}
.jspTrack {
   width: 8px;
   background-color: #ededed;

}
.jspDrag {
   width: 8px;
   background-color: #ccc;
}

I checked http://jscrollpane.kelvinluck.com/basic.html as I am new to jScrollPane but not getting where am I missing code.