mCustomScrollbar

by lustre

HTML

<script src="http://malihu.github.io/custom-scrollbar/3.0.0/jquery.mCustomScrollbar.concat.min.js"></script>
<link rel="stylesheet" href="http://malihu.github.io/custom-scrollbar/3.0.0/jquery.mCustomScrollbar.min.css">
<div id="container1">
  <p>1</p>
  <p>2</p>
  <p>3</p>
  <p>4</p>
  <p>5</p>
  <p>6</p>
  <p>6</p>
  <p>6</p>
</div>


<div id="container2">
    <p>1</p>
  <p>2</p>

  
</div>

CSS

#container1,
#container2{
    height:200px;
    width:100px;
    padding:5px;
    border:1px solid black;
}

.mCSB_draggerRail{width:20px;}

JavaScript

$('#container1, #container2').mCustomScrollbar({ 
        theme:"dark-3"        
});

$(document).on('click', '#container1 p, #container2 p', function(e){
  alert("hello");
});