Facebook like scrollbar (from here, https://codepen.io/hiago_silverio/pen/RRdJbz)

scrollbar.html

<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<style>
a.item-navbar{
  border: 1px solid #e3e3e3;
  padding: 10px 5px;
  color: #333;
  margin: 20px 0 !important;
  display: table;
  width: auto; 
  text-decoration: none;
  
}
a.item-navbar:hover{
  background: rgba(0,0,0,0.5);
  color: #fff;
  text-decoration: none;
}
.dropdown-menu{
  margin:7px 0 !important;
}
.dropdown{
  margin: 10px;
}
.dropdown > ul{
	height: auto;
	max-height: 200px;
	margin:  0;
  overflow-y: hidden;
}
.dropdown > ul:hover{
  overflow-y: auto;
	overflow-x: hidden;
	-webkit-overflow-scrolling: touch;
	-moz-overflow-scrolling: touch;
	-ms-overflow-scrolling: touch;
	-o-overflow-scrolling: touch;
	overflow-scrolling: touch;
}
.dropdown > ul::-webkit-scrollbar {
	-webkit-appearance: none;
	width: 7px;
}
.dropdown > ul::-webkit-scrollbar-thumb {
	border-radius: 2px;
	background-color: rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 0 1px rgba(255,255,255,0.5);
}
</style>
<div class="dropdown">
  <a href="#" class="item-navbar dropdown-toggle" type="button" data-toggle="dropdown">Dropdown Menu
  <span class="caret"></span></a>
  <ul class="dropdown-menu">
    <li><a href="#">HTML</a></li>
    <li><a href="#">CSS</a></li>
    <li><a href="#">JavaScript</a></li>
     <li><a href="#">Lorem</a></li>
    <li><a href="#">Lorem</a></li>
    <li><a href="#">Lorem</a></li>
    <li><a href="#">Lorem</a></li>
    <li><a href="#">Lorem</a></li>
  </ul>
</div>