14 February 2007

Fix anchors in Safari

So i was looking on the textpattern forums and there was a a post about anchor links in safari. I always assumed mine worked, but i was sadly mistaken…

It really doesn’t seem to follow any reasoning. It also seems to be a known issue that is on QuirksMode … but not really sure…

So on the forum there was a fix to put your css file at the document root… wtf … why?

So here is a link in my site … works in Firefox fine, but not in Safari … not really sure why… anyone anyone anyone…

nuff » named anchor

Now this may be a hack but you can use JavaScript to solve the problem.

.
//call when page loads
window.onload = jumptoanchor;
//
//jumps to anchor
function jumptoanchor()
{
  //test for anchor existence
  if(window.location && 
     window.location.href.match(/#(\w.+)/))
  {
    //jump to anchor
    window.location.hash=
    window.location.href.match(/#(\w.+)/)[1]; 
  }
}

file: fix_anchors_safari.js

Basically when the page loads, it checks the url for an anchor, if one exist, use JavaScript to go there. I am not using on my site because I consider this a broken behavior in Safari, but in the work world i just might.

bonus bookmarklet: when you have gone to page with an anchor and you have moved around ... converting the above code to a bookmarklet... makes it easy to find original anchor:

db: reposition
 

comment

This fix works – but it has the annoying side-effect of making the window tab’s “loading…” icon keep spinning forever after everything has in fact loaded. I’ve seen this side-effect before, I think on a script that made smooth scrolling.

2007-05-08
nev

Hmm … i have seen this before too, but can’t consistently reproduce. I figure it does no harm.

2007-05-08
Daniel Bulli2

It does no harm… But, most of the time I have multiple tabs open when using Safari, and it’s so distracting that I can’t use it! No matter that I know the page has loaded, the spinning cog icon makes me think something is waiting to loa, as it’s supposed to. I’d use this fix if I could get rid of that side-effect.

2007-05-09
nev

You don’t need to call match again – you can just say this instead:

window.location.hash=RegExp.$1;

That’ll pull the (\w.+) group you just matched out of RegExp memory.

Matches are pretty expensive to run sometimes.

2007-08-13
usernameguy

Cool … yeah that makes sense !

2007-08-13
Daniel Bulli2

hi
i have one problem , i have 1 anchor hyperlink on my form like top and first time load its working fine but after refreshing the page it appends #top#top along wid the url of location. How can i overcome this.
Pls help

2008-03-06
shallu

Shallu I can’t contact you because you didn’t leave an email and I need more info. Basically I can’t reproduce the behavior that you are seeing.

2008-03-10
Daniel Bulli2


note: you can only submit after you hit preview


nuff-respec is a weblog written by daniel bulli a senior web programmer in boston, ma.
more >

contact | resume | profile | twitter

recently :::