0

The legacy website I inherited is comprised of href #links to navigate through the website. It's rather large so I don't want to recreate the whole thing, even though I know the #urls are not best practice. One enhancement that is necessary is to enable the back and forward buttons in the browser so that they will not only change the URL (which it does) but refresh the page to show the previous/forward URL's content.

If anyone could point me in a direction to make this happen, I would definitely appreciate it.

Michael Neas
  • 944
  • 1
  • 7
  • 15
  • `#links`? `#urls`? ajax navigation? or what? – Marc B Aug 24 '15 at 19:03
  • I don't know what it is called unfortunately, I think it is ajax navigation. Every time you click on a new page in the navigation bar the url changes. So, website.com/#home -----(click on link)------> website.com/#profile – Michael Neas Aug 24 '15 at 19:28

1 Answers1

1

Have some javascript on your page load look for the anchor and then scrollTo it

var url = "www.website.com/#a1", idx = url.indexOf("#")
var hash = idx != -1 ? url.substring(idx+1) : "";

function scrollTo(hash) {
    location.hash = "#" + hash;
}
Bryant Frankford
  • 401
  • 3
  • 14
  • The Var URL in this example would need to be changed every page? – Michael Neas Aug 25 '15 at 14:17
  • Yes, you can either do that manually or you can get it using javascript. Here is an example: http://stackoverflow.com/questions/1034621/get-current-url-in-web-browser – Bryant Frankford Aug 25 '15 at 14:19
  • Thanks! Another question, so since the entire navigation system uses hrefs to these html pages referenced with # symbols, wouldn't this js hold one one reference to go back to? SO If you were on the home page, clicked on a profile page link then clicked on a settings link and back to the profile page, if you then pushed the back button would it go to the home page? – Michael Neas Aug 25 '15 at 14:47
  • 1
    If you assign your variable to be set on a trigger such as .class or #id click then you would change the URL every time it's clicked. You can do this in JS or in JQUERY. In Jquery it would look like this. $('.class').click(function( ){var url ="URL";} Again, you'll have to mess with this some to get it to work but I think this will help. – Bryant Frankford Aug 25 '15 at 14:50