JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://owlgraphic.com/owlcarousel/owl-carousel/owl.carousel.css">
<script src="http://owlgraphic.com/owlcarousel/owl-carousel/owl.carousel.min.js"></script>
<script src="//malihu.github.io/custom-scrollbar/jquery.mCustomScrollbar.concat.min.js"></script>
<link rel="stylesheet" href="//malihu.github.io/custom-scrollbar/jquery.mCustomScrollbar.min.css">
<div id="carousel" class="owl-carousel">
  <div class="carousel-item loader">&gt;&gt;&gt;&gt; swipe &gt;&gt;&gt;&gt;</div>
  <div class="carousel-item">
    <div id="scrollable">
      <p>Duis posuere ligula eu nunc volutpat ultricies sed ac dolor! Cras placerat sapien quis cursus ullamcorper. Donec sagittis, augue in scelerisque malesuada, enim leo molestie urna, eu auctor metus ipsum eget nisl. Sed convallis semper volutpat. Nulla vulputate ante nec sapien tincidunt vulputate. Sed sed enim vel nunc tempor malesuada eu et mauris. Interdum et malesuada fames ac ante ipsum primis in faucibus. In ex erat, pellentesque eget diam vel, porta commodo dui. Vestibulum fringilla sem lacus, vel cursus velit fermentum sit amet. Etiam sed arcu nec orci ultricies faucibus. Curabitur faucibus convallis leo, sed semper lectus auctor at. Mauris eu erat urna. Suspendisse pellentesque convallis mollis.</p>
      <p>Vivamus quis turpis augue. Mauris eleifend quis est non aliquet. Pellentesque ante tortor, convallis vitae leo non, scelerisque vulputate dolor? Curabitur placerat, metus eget consequat tincidunt, mauris dolor laoreet nunc, eget rhoncus enim erat eu mauris. Proin venenatis orci ac leo sodales, et ultricies tellus consequat. Praesent ac magna ut massa vehicula pretium non quis velit. Nam cursus tortor et massa cursus, ac malesuada arcu luctus. Aliquam erat volutpat. Phasellus ut tempus felis. Aliquam rutrum turpis placerat orci pretium, sit amet feugiat nibh accumsan. Vivamus faucibus nec nulla vitae facilisis. Donec id commodo orci. In pretium congue augue ac convallis? Pellentesque sed sem...

CSS

.carousel-item {
  height: 300px;
  background: #fff;
  color: #000;
  padding: 15px;
}
.carousel-item.loader {
  background: #666;
  color: #eee;
  text-align: center;
}
#scrollable {
  height: 100%;
  overflow: auto;
}
#log {
    height: 200px;
    overflow: hidden;
}

JavaScript

$('#carousel').owlCarousel({
    singleItem: true
});
$('#scrollable').mCustomScrollbar({
  axis: 'y',
  theme: 'dark'
});
$('.carousel-item').on('mousedown mouseup touchstart touchend', function(e) {
  $('#log').prepend('<div>' + e.type + '<div>');
});