jquery how to scroll top on page load only when using bootstrap tabs

Question

i've setup some jquery to load a specific bootstrap 3 tab when clicking a link. this works great when i access the page via a link on another page. but when i click different tabs when on the actual page, it keeps scrolling to the top every time i click. how can i only make it scroll when the page loads & not when the tabs are clicked on the page? thanks!!

here's my code.

html

<ul id="custom-tabs-0" class="nav nav-pills">
<li class="active"><a data-toggle="tab" href="#custom-tab-0-sales">Sales</a></li>
<li class=""><a data-toggle="tab" href="#custom-tab-0-client-services">Client Services</a></li>
</ul>

jquery

// Javascript to enable link to tab
jQuery(document).ready(function() {
var url = document.location.toString();
if (url.match('#')) {
    $('.nav-pills a[href=#'+url.split('#')[1]+']').tab('show') ;
} 

// Change hash for page-reload
$('.nav-pills a').on('shown.bs.tab', function (e) {
    window.location.hash = e.target.hash;
    $("html,body").animate({scrollTop: 300}, 1000);
})
});