Why does this code work fine in google chrome but fails in safari (both on mac and iphone)?

Question

JavaScript

The code helps to smoothly lower the user's screen to the anchor, with the necessary indentation from the top so that the menu fixed at the top does not obscure it.

<script>
  $(document).ready(function(){
    	$('a[href^="#"]').bind('click.smoothscroll',function (e) {
    		e.preventDefault();
    		var target = this.hash,
    		$target = $(target);
    		$calculus = ( $target.offset().top - 75 );
        $target_to = $calculus.toFixed();
    		$('html, body').stop().animate({
    			'scrollTop': ($target_to+'px')
    		}, 900, 'swing');
    	});
    });
</script>

Answer 1

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
  $(document).ready(function(){
        $('a[href^="#"]').on('click',function(e) {
            e.preventDefault();

            var target = this.hash,
                $target = $(target),
                $calculus = ( $target.offset().top - 75 ),
                $target_to = $calculus.toFixed();

            $('html, body').stop().animate({
                'scrollTop': ($target_to+'px')
            }, 900, 'swing');
        });
    });
</script>

works in safari for mac