: # id - urls with id first display full page, then move to #id I've noticed this in the new version of chrome, and ie9 and 10. Some urls in a photo gallery have a #id tag as they are

@Pope3001725

This can be annoying. The reason this happens is because the browser treats the # in the url as an anchor and then tries to find the html element who has an id that matches that anchor.

Eduardos answer about using Javascript is the solution.
You can use jquery or javascript to change the url hash when a link is clicked to something that does not exist. Then if the user bookmarks the page with that specific hash, the browser will search for a hash that is random and does not exist. Now if you are using fancy js plugins like scroll to or other you would have to modify them to also have the same behavior.

At which point you should ask the question on StackOverflow and be detailed in the code you are using.

Take a look at this simple fix here stackoverflow.com/questions/3659072/jquery-disable-anchor-jump-when-loading-a-page
You can also do something like this:

$(function(){
//Remove the hash
if (location.hash) {
window.location = "/"
}
}

Vote Up Vote Down

@Martha676

Anchoring with ids is a feature of html4 of which many of the new browsers try to support, practically id behave like anchor name:


The id attribute may be used to create an anchor at the start tag of
any element (including the A element).


In the same document says:


The id and name attributes share the same name space. This means that
they cannot both define an anchor with the same name in the same
document. It is permissible to use both attributes to specify an
element's unique identifier for the following elements: A, APPLET,
FORM, FRAME, IFRAME, IMG, and MAP. When both attributes are used on a
single element, their values must be identical.


Since it needs to build a namespace table with all the anchor names, it needs to load all the elements, consequently the entire page before it can jump to that specific link. Much like JavaScript where the code needs to load before it can work.

I don't see any way to make the browser jump to that link before the page has finished loading. And I think behaved the same with anchors names.

The only workaround I can think of is using JavaScript. Load some lower bandwidth nice placeholders and then load the images and big resources after the page has loaded. There are a lot of ways to code that, you have one example here: snipplr.com/view/10934/.

Vote Up Vote Down