为什么我的scrollTop不起作用？

Question

我对scrollTop（）的行为有疑问。我将展示一个小例子：

＆＃13;

＆＃13;

/*----Code JQuery-----*/
$(".box").scroll(function() {
   		var $this = $(this);
        var oldTop = $this.scrollTop();
        var newTop = (Math.round(oldTop / 200) ) * 200; 
        $this.scrollTop(newTop);
  });

＆＃13;

/*----Code CSS-----*/
div.box{
  width: 200px;
  height: 200px;
  overflow: scroll;
}
div.small{
  width: 200px;
  height: 100px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<div class="box">
       <div class="small" style="background-color: brown">All your text content...<br></div>
       <div class="small" style="background-color: pink">All your text content...<br></div>
       <div class="small" style="background-color: blue">All your text content...<br></div>
       <div class="small" style="background-color: purple">All your text content...<br></div>
       <div class="small" style="background-color: yellow">All your text content...<br></div>
       <div class="small" style="background-color:green">All your text content...<br></div>     
       <div class="small" style="background-color:orange">All your text content...<br></div> 
       <div class="small" style="background-color:red">All your text content...<br></div>
</div>

＆＃13;

＆＃13;

＆＃13;

鼠标滚动效果不佳，以及滚动条的按钮也是如此。非常感谢你，为你提供帮助。 （对不起我的英语......）