3

On this map:

http://web.pacific.edu/documents/marketing/campus-map/version%202/stockton-campus-2.0.htm

I have an anchor at the top, and I want the page to jump to the anchor when a link is clicked.

I'm currently using 

window.location = '#top';

It works as expected in FF, Opera, and Chrome, but not in IE 7.

I've tried all permutations like window.location.hash and window.location.assign() and also scrollIntoView(true) and focus().

How can I make it work in IE?

Edit: Nothing seems to work, which makes me think it's not the syntax, but something about the JS... here is the click event handler... could it be because it returns false? I'm grasping at straws. 

// Click handler for each location link
$('#index a').click(function()
{
    hideMarkers();
    location.href = location.href + "#top";
    var marker = showMarker( $(this).attr('data-id') );
    GEvent.trigger( marker, "click" );
    return false;
});

Edit: Assignment to window.location.hash breaks in IE7 and IE8 on pages that were loaded as a result of page redirection via the HTTP "Location" header. The solution is to return a page with Javascript that itself will perform the redirection. See the answer by Joe Lapp.

Joe Lapp
  • 2,435
  • 3
  • 30
  • 42

6 Answers6

8

I have this code in production and it works fine in IE7...

location.hash = "#top";

However, if you are just trying to scroll to the top, this ought to be a lot easier...

window.scrollTo(0, 0);
bdurao
  • 555
  • 3
  • 6
Josh Stodola
  • 81,538
  • 47
  • 180
  • 227
  • I should clarify, I ended up using scrollTo(0,0). I feel kinda dumb, I wasn't aware of this method - but it does work! –  Jul 23 '09 at 22:12
7

The location object is broken up into several properties - href is only one of them

Another one, hash, is what you're looking for.

top.location.hash = 'top';

You can also do this without using the location/href at all - just use scrollTo()

top.scrollTo( 0, 0 );
Peter Bailey
  • 105,256
  • 31
  • 182
  • 206
  • Really? Works for me. IE 7.0.5730.13. FYI, you don't need a named anchor for #top to work - browsers read that automatically. Alternatively, you could use `top.scrollTo(0,0);` – Peter Bailey Jul 23 '09 at 19:53
  • To be specific, any hash that does not correspond to any element's id will automatically take you to the top of the page (i.e. not just `#top`). It could be `#top`, `#GOGOGADGETSCROLLUP` or just `#`. – David John Welsh Nov 21 '12 at 09:18
3

I also had a problem with windows.location.hash working in all browsers but IE7 and IE8 (at least on Vista). After much experimenting, I discovered that page redirection was breaking hash assignment.

An error will occur in IE7 or IE8 if you assign a value to windows.location.hash from within a page that was loaded as a result of redirection via the HTTP "Location" header.

After discovering this, I was able to find a fix elsewhere on StackOverflow (see here). The solution is to have the browser redirect via Javascript. Here I repost the solution from the other StackOverflow page:

<html>
<head>
    <meta http-equiv="refresh" content="0; url=__REDIRECT_LOCATION__">
    <script>window.location = "__REDIRECT_LOCATION__";</script>
</head>
</html>

This would explain why some people were having a problem with setting hash and some were not, but I do not know that the originator of the thread was redirecting.

I should also point out that I couldn't just use scrollTo() because my purpose was to remove the hash tag from the address bar without reloading the page, not to scroll.

Community
  • 1
  • 1
Joe Lapp
  • 2,435
  • 3
  • 30
  • 42
2

location.href = location.href.split("#")[0] + "#top"

EDIT: to avoid the possibility of ever having two hashes.

geowa4
  • 40,390
  • 17
  • 88
  • 107
  • You forget there might be a query string in the URL. Although never tried with # after the query string. Wonder if it will work. – Itay Moav -Malimovka Jul 23 '09 at 17:53
  • If you do that won't it add the #top multiple time at the end of URL? – Nordes Jul 23 '09 at 17:55
  • @Nordes: i'm assuming he's not using the `href` of the anchor. – geowa4 Jul 23 '09 at 17:56
  • I'm using the href for something else, it's weird to explain but I need to do it with Javascript. And it seems like that would add '#top' multiple times to the URL, but I will try it out. –  Jul 23 '09 at 18:01
  • I have edited to avoid the possibility of ever having two hashes in the url – geowa4 Jul 23 '09 at 19:18
  • Thanks - unfortunately, it still doesn't work. Nothing seems to work; I don't think it's necessarily the wrong syntax, maybe something else in my code, but I don't know what. –  Jul 23 '09 at 19:24
  • yeah, run that code in a sandbox-like environment, like Firebug. I did, and it works. Make sure you don't have a scoping problem. – geowa4 Jul 23 '09 at 19:49
0

You have to check for hash before appending it. I did it with this,

window.location = ((location.href).indexOf('#') == -1 ? location.href + "#top" : location.href);

Max
  • 1,528
  • 21
  • 33
-1
window.location.href = '#top';

And if this doesn't work, try the full URL

window.location.href = 'http://domain.com/my.html#top';
Itay Moav -Malimovka
  • 52,579
  • 61
  • 190
  • 278