Почему select скроллится к первому значению?

Не могу понять, почему кастомизированный select с multiple скроллится к первому выбранному значению при выборе любого пункта? Как побороть понятно, интересна сама причина.

<select name="" multiple id="" size=3>
  <option value="1">Значение 1</option>
  <option value="2">Значение 2</option>
  <option value="3">Значение 3</option>
  <option value="4">Значение 4</option>
  <option value="1">Значение 5</option>
  <option value="2">Значение 6</option>
  <option value="3">Значение 7</option>
  <option value="4">Значение 8</option>
</select>
$("select[multiple]").mousedown(function(e){
    e.preventDefault();
    e.target.selected = !e.target.selected;
}).mousemove(function(e){e.preventDefault()});

https://codepen.io/anon/pen/VWPyoY