I've read other stackoverflow threads on this topic, but they relate to using scripts..... but my application is a standard HTML link. I have a link on page 2.
<a href="page1.html#paragraph3"><h6>click here: to view paragraph 3 on page 1.</h6></a>
The anchor on page 1. =
<a id="paragraph3"></a>
Within the page, this link works. However, from a different page, the chosen section displays for a millisecond, and the page jumps to the top.
Why is this happening, and how should I be constructing the link, for it to jump correctly?
Javascript in Use
<!-- ============ Navigation Bar ============= -->
<div id='output1'></div>
<script type="text/javascript">
<!--
document.getElementById('output1').innerHTML = menunav+home+info+infosub+doit+blog+lang+contact;
// End -->
</script>
<!-- ============ //End of Navigation Bar ============ -->
Scroll to top (activated by a floating arrow icon)
jQuery(function($) {'use strict';
jQuery(document).ready(function($) {
$(".scroll").click(function(event){
event.preventDefault();
$('html,body').animate({scrollTop:$(this.hash).offset().top},200);
});
});
Smooth Scrolling
/* <!--smooth-scrolling-of-move-up-->*/
$(document).ready(function() {
/* var defaults = {
containerID: 'toTop', // fading element id
containerHoverID: 'toTopHover', // fading element hover id
scrollSpeed: 1200,
easingType: 'linear'
}; */
$().UItoTop({ easingType: 'easeOutQuart' });
});
I believe that is all the relevant code.
Having copied and pasted it, I'm wondering if it is the writing of the navbar. But it is called right at the top of the page.... so I'm not sure.