scrolling dotted lines

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<div id="dotted-line">
<div id="up-arrow">^up</div>
</div>

CSS

#dotted-line {
  background: url(https://daisygroup.com/wp-content/uploads/2015/12/orange-dash.png); */
    height: 6px;
    width: 6px;
    position: fixed;
    left: 32px;
    top: 70px;
    z-index: 20;
    display: block;
}

JavaScript

$(window).scroll(function(){
            if ($(window).scrollTop() > 10){
              var pos = $('body').scrollTop();
                $('#dotted-line').css('height',pos/4);
                $('#up-arrow').css('top',pos/4);
            } else {
               $('#dotted-line').css('height','6px');
               $('#up-arrow').css('top','-150px');
            }
        });