Encountering an issue with AngularJS ng-include where I am trying to navigate to the top of a different page after clicking a button in the footer.
HTML (index.html)
<body>
<a name="top"></a>
<!-- header section -->
<div ng-include="'views/header.html'"></div>
<!-- views section -->
<div ng-view></div>
<!-- footer section -->
<div ng-include="'views/footer.html'"></div>
</body>
HTML (footer.html) href="#!request" is used to load the request page successfully, but it does not scroll to the top of the new page.
<div class="cont3">
<div><a href="#!request" class="footer-link" id="myBtn">Request an interpreter</a></div>
</div>
Javascript
<script type="text/javascript">
if ($('#myBtn').length) {
var scrollTrigger = 100,
backToTop = function () {
var scrollTop = $(window).scrollTop();
if (scrollTop > scrollTrigger) {
$('#myBtn').addClass('show');
} else {
$('#myBtn').removeClass('show');
}
};
backToTop();
$(window).on('scroll', function () {
backToTop();
});
$('#myBtn').on('click', function (e) {
e.preventDefault();
$('html, body').animate({
scrollTop: 0
}, 100);
});
}
</script>