Paver JS Smooth Scroll

by Preston Smith

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-throttle-debounce/1.1/jquery.ba-throttle-debounce.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/0.0.1/prism.min.js"></script>
<script src="//terrymun.github.io/paver/dist/js/jquery.paver.min.js"></script>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css">
<div class="container">
<div class="row">
<div class="col-md-12 panorama">
<img src="http://terrymun.github.io/paver/demo/images/p3.jpg">
</div>
<div class="col-md-12">
<p class="text-left">enter above panorama on left side</p>
<p class="text-left">this will make the image jump over here</p>
<p class="text-left">-------------</p>
<p class="text-left">is there a way to make is smoothly scroll over here?</p>

</div>

</div>
</div>

SCSS

.container{
  border: 1px solid pink;

}

.panorama {
	height: 500px;
	overflow-x: scroll;
	overflow-y: hidden;
	img {
		height: 100%;
	}
}

JavaScript

$(function() {
	$('div.panorama').paver();
});