"Named Anchor" Hack/Workaround for Safari??

Discussion in 'Web Design and Development' started by DesignIt, Dec 15, 2005.

  1. macrumors member

    Joined:
    Aug 2, 2005
    #1
    Does anybody know of a work around for "named anchors" in Safari? Safari is the only browser where this (named anchors) does not work.
     
  2. macrumors 603

    OutThere

    Joined:
    Dec 19, 2002
    Location:
    NYC
    #2
    As far as I know there is no problem...I just made a quick page with the following code and it worked perfectly.

    Code:
    <html>
    <head>
    <title>
    Test Page
    </title>
    </head>
    <body>
    <a href="#whatever">Test Link</a>
    <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
    <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
    <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
    <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
    <br><br><br><br><br><br><br><br>
    <a name="whatever">It worked!
    </body>
    </html>
    
     
  3. thread starter macrumors member

    Joined:
    Aug 2, 2005
    #3
    That doesn't really show anything because the link isn't "moving" the page anywhere.
     
  4. macrumors 603

    OutThere

    Joined:
    Dec 19, 2002
    Location:
    NYC
    #4
    Fixed
     
  5. thread starter macrumors member

    Joined:
    Aug 2, 2005
    #5
    THanks for your reply and effort, but with all due respect, nothing has been fixed. =)
     
  6. macrumors member

    Joined:
    Jul 18, 2002
    #6
    Worked for me
     
  7. macrumors 6502

    Joined:
    May 27, 2005
    #7
    check a list apart or boxes and arrows
    !
    $
     
  8. macrumors G5

    CanadaRAM

    Joined:
    Oct 11, 2004
    Location:
    On the Left Coast - Victoria BC Canada
    #8
    I'm sorry, you'll have to qualify your question better.

    "Safari is the only browser where this (named anchors) does not work." This general assertation is not true.

    I've just visited one of my own sites with named anchors (Dreamweaver coded) in Safari (OS 10.3.9) and it works perfectly.

    If you have a problem with a specific version of Safari, or specific HTML code, please elaborate.
     
  9. thread starter macrumors member

    Joined:
    Aug 2, 2005
    #9
    Very true. Pretty vague question. Here is a link to the page that doesn't work:

    link removed temporarily
     
  10. macrumors G5

    CanadaRAM

    Joined:
    Oct 11, 2004
    Location:
    On the Left Coast - Victoria BC Canada
    #10
  11. macrumors 603

    OutThere

    Joined:
    Dec 19, 2002
    Location:
    NYC
    #11
    Well technically I fixed my example so that it demonstrated that named anchors do in fact work in Safari...now I did not fix your page, I'll admit that. Maybe it has something to do with the fact that it's linking to a different scrolling section? :confused:
     
  12. thread starter macrumors member

    Joined:
    Aug 2, 2005
    #12
    I've tried that too previously. That's why I've concluded that it is possible only thru javascript.
     
  13. macrumors 65816

    radiantm3

    Joined:
    Oct 16, 2005
    Location:
    San Jose, CA
    #13
    I'm not sure if this is causing the issue, but you have multiple ID's with the same name. ID's have to be unique to a page (meaning only 1 instance of an ID on a page). You can anchor directly to any tag with an ID. Here is the best way to do it:

    Code:
    <ul class="skiplist">
    	<li><a href="#cont">Skip Navigation.</a></li>
    	<li><a href="#side">Jump to Side Bar.</a></li>
    </ul>
    .
    .
    .
    .
    .
    .
    .
    .
    .
    .
    <div id="cont">
    All your Main content is in here.
    </div>
    <div id="side">
    All your sidebar elements here.
    </div>
    
    
    The links will jump to the ID's respectively. You are just using way too many unnecessary tags, classes, and IDs.
     
  14. macrumors G5

    CanadaRAM

    Joined:
    Oct 11, 2004
    Location:
    On the Left Coast - Victoria BC Canada
    #14
    OK, sorry to have taken up your time with things you already tried :(
     
  15. thread starter macrumors member

    Joined:
    Aug 2, 2005
    #15
    I appreciate your help, I hope you didn't take that in the wrong way.
    Thanks again! =)
     
  16. thread starter macrumors member

    Joined:
    Aug 2, 2005
    #16
    Thanks. I realize I am no expert with CSS and still learning. Although, as far as I know, I am not using any duplicate ID's. Where are you finding multiple ID's with the same name?
     
  17. macrumors 65816

    radiantm3

    Joined:
    Oct 16, 2005
    Location:
    San Jose, CA
    #17
    I just saw it once, at the top so I assumed there's a chance there might be more:

    Code:
    <ul class="skiplist">
    	<li class="skip"><a href="#cont" id="menu">Skip Navigation.</a></li>
    	<li class="skip"><a href="#side" id="menu">Jump to Side Bar.</a></li>
    </ul>
    
    You are using the menu ID twice here. You could really optimize that block of code too. You would have the same amount of styling capability with something like this:

    Code:
    <ul id="skiplist">
    	<li><a href="#cont">Skip Navigation.</a></li>
    	<li><a href="#side">Jump to Side Bar.</a></li>
    </ul>
    
    Since you only have 1 instance of your #skiplist on a page, make it an ID. Then you can style each element within skiplist like this:

    #skiplist li{}
    #skiplist li a{}

    No need to add classes and IDs to the li and a tags.
     
  18. thread starter macrumors member

    Joined:
    Aug 2, 2005
    #18

    Oh...you are referring to the span class I have to change the color of the bullets. This is the first time I have used a li, in case it wasn't obvious.
    :D I'm not too terribly concerned about those, as they aren't what's causing the "anchors" to not work.

    Thanks for your tips!
     
  19. macrumors 65816

    radiantm3

    Joined:
    Oct 16, 2005
    Location:
    San Jose, CA
    #19
    Well you can never tell what is causing a bug until you can fix all the errors to eliminate the possibilities. I always start by making sure my pages validate:
    http://validator.w3.org/check?uri=http://www.jimthatcher.com/skipnav.htm
     
  20. macrumors newbie

    Joined:
    Dec 18, 2005
    #20
    I'm still having a little trouble. I want to link from page 1 to an anchor on page 2. But when I click on the link in safari it doesn't work, it only brings me to the page itself, not to the anchor, while it does work with IE (mac). Anybody any thoughts on this?

    The anchor does work in safari when I place the link on the same page btw.

    Thanks, Tim
     
  21. macrumors 68000

    Joined:
    Aug 20, 2003
    Location:
    Long Beach, California
    #21
    I think that this is an actual limitation on Safari's part. I don't think I've ever seen this work properly. :(
    -Chase
     
  22. macrumors 65816

    radiantm3

    Joined:
    Oct 16, 2005
    Location:
    San Jose, CA
    #22
    It works fine for me on my website. Are you guys using the latest version of safari?
     
  23. thread starter macrumors member

    Joined:
    Aug 2, 2005
    #23
    I did validate this page and the only thing that didn't pass was the fact that I have an image sitting inside of the, ul and li, coding. I'm not sure why this isn't allowed. If I don't put the image there, I don't like how it sits up really high away from the list.

    Also, even with the image in the correct location (ie-page validated), the name anchor still doesn't work in Safari.
     
  24. macrumors 65816

    radiantm3

    Joined:
    Oct 16, 2005
    Location:
    San Jose, CA
    #24
    If you are using the latest version of safari then you must still have a problem with your code because name anchoring works on all of my websites just fine in safari.

    Also, I still get validation errors on that page on your site. You still have 2 of the same IDs which I mentioned towards the beginning of this thread. :eek:
     
  25. thread starter macrumors member

    Joined:
    Aug 2, 2005
    #25
    I guess I am at a loss then because I am not aware of the 2 ID's you are referring to.

    :confused:

    edit: I am using this version of Safari: 1.3.1 (v312.3.3)
     

Share This Page