When I change select it will scroll accordingly to the div and it is working fine, But how to I change select on document scroll ? 

```js
$("select").change(function(){
  var divid = $(this).val();
  $('html, body').animate({
        scrollTop: $("." + divid).offset().top
    }, 2000);
});
```

```css
div{
  height:300px;
}
```

```html
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select>
  <option value="div1">div1</option>
  <option value="div2">div2</option>
  <option value="div3">div3</option>
  <option value="div4">div4</option>
</select>

<div class="div1">
div1
</div>

<div  class="div2">
div2
</div>

<div  class="div3">
div3
</div>

<div class="div4">
div4
</div>
```