This is where Andy Clover’s notes are invaluable. Now all we need to know is where we are in the document, and what our destination is. We know what we clicked on, and what that points to. If we didn't find a destination, give up and let the browser do Var allLinks = document.getElementsByTagName('a') Now loop all A tags until we find one with that name Links have a hash attribute that contains the # and the section that appears after it in the URL, so let’s now walk through all the links in the document and check whether their name attribute is equal to the hash part of the clicked-on link: // First strip off the hash (first character) Now, we need to find the destination: the tag that corresponds to the part after the hash in our clicked-on link. Just to be paranoid, we also check that what we’ve got is an A tag, in case we’ve missed something: if (() != 'a') return The useful location object tells us about the URL of the document we’re looking at now, so try this: for (var i=0 i We need to walk through this list, and work out which of the links we’ve found are internal. Getting a list of all the links is easy: var allLinks = document.getElementsByTagName('a') Finding Internal Linksįirst, we need to identify all the links in the document, and then work out which of them are internal ones. In this tutorial, we’ll use a smattering of JavaScript to ensure that links that are internal to the document scroll the user to their destination, rather than jumping straight there and confusing users. You can subtract from it the height of your fixed header before you do the scroll. Both Chris’ and Devin’s solutiosn use target.offset ().top as the target vertical position. The answer to this problem is to scroll the user through the document to the linked location, like this. All you need is adjust the position you scroll to. When they’re navigating through a long document, users often are confused or disoriented when they click a link that jumps to another location in that same document.Īre they on the same page, or a different page? Should they scroll more from here? What’s going on?
0 kommentar(er)
