Can't quite get internal linking working...

Discussion in 'HTML' started by Gary, Feb 6, 2007.

  1. Gary

    Gary Guest

    Im just experimenting with internal linking.

    The problem I have is that the page doesnt jump to the link, but only
    the page the link is on. For example i'd like to jump so that the link
    im jumping to appears as the first item on the page, and not halfway
    down the page which is what's happening at the moment.

    Here is my HTML: -

    any ideas on what is going wrong please?

    ===============================

    <html>

    <head>
    <title>My Title Page</title>
    </head>


    <body>
    <a href="#heading1">Jump to heading 1</a>
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <h1 id="heading1">Heading1</h1>
    </body>

    </html>
     
    Gary, Feb 6, 2007
    #1
    1. Advertising

  2. Gary

    jim Guest

    You've almost got it there Gary...
    ==========================================
    Instead of this: <h1 id="heading1">Heading1</h1>
    use this: <a name="heading1"/><h1 id="heading1">Heading1</h1>

    I'm guessing that you want the user to see the text, "Heading1". The
    target anchor or 'a' tag will be invisible (ie: the <a name="____" /
    >) but

    it needs to be there in order for the link to work: <a
    href="#________">Heading1</a>

    So there are two parts to internal links:
    1. the link: <a href="#link_name">Link Name</a>
    and,
    2. the target: <a name="link_name" />

    Each of them uses the <a tag, just that one is viewable and the
    other is not!

    Hope that helps,

    Jim
     
    jim, Feb 6, 2007
    #2
    1. Advertising

  3. Gary

    Gary Guest

    Thankyou Jim for your kind comments. I have tried that but have the
    same problem. The page is not jumping so that my link is directly
    below address bar, but jumping so that my target link is about 3/4's
    the way down the page.

    I am using Internet Explorer, version 6. Any idea why this isn't
    working?

    here is my revised html i made using your suggestion: -

    <html>

    <head>
    <title>An internal link example</title>
    </head>

    <body>
    <p>the following line will contain a link to a section someway down
    the document.</p>
    <p><a href="#header1">Jump to bottom of page</a></p>
    <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 />
    <hr />
    <a name="header1"/><h1 id="header1">Header1 Internal Link!</h1>
    <hr />
    <br />
    <br />
    <br />

    </body>

    </html>
     
    Gary, Feb 6, 2007
    #3
  4. "Gary" <> wrote in message
    news:...
    > Thankyou Jim for your kind comments. I have tried that but have the
    > same problem. The page is not jumping so that my link is directly
    > below address bar, but jumping so that my target link is about 3/4's
    > the way down the page.
    >
    > I am using Internet Explorer, version 6. Any idea why this isn't
    > working?
    >
    > here is my revised html i made using your suggestion: -
    >
    > <html>
    >
    > <head>
    > <title>An internal link example</title>
    > </head>
    >
    > <body>
    > <p>the following line will contain a link to a section someway down
    > the document.</p>
    > <p><a href="#header1">Jump to bottom of page</a></p>
    > <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 />
    > <hr />
    > <a name="header1"/><h1 id="header1">Header1 Internal Link!</h1>
    > <hr />
    > <br />
    > <br />
    > <br />
    >
    > </body>
    >
    > </html>
    >


    It might be that you haven't got very much to display below that header.
    Try adding some more substance underneath it and see if it then behaves as
    you want it to.

    ::mrcakey::
     
    mrcakey \(The Eclectic Electric\), Feb 6, 2007
    #4
  5. jim wrote:
    > You've almost got it there Gary...
    > ==========================================
    > Instead of this: <h1 id="heading1">Heading1</h1>
    > use this: <a name="heading1"/><h1 id="heading1">Heading1</h1>



    Gary: Disregard this. Yes you can create and anchor with:

    <a name="anchorName"></a>

    But and ID property will work as well and does not need the extra markup.

    My guess why the page is not scrolling to the anchor is that the browser
    does not need to. If the anchor is visible within the browser window
    already and as in your example there is no content after the anchor the
    browser will not scroll. Confirm this by adding more content after your

    <h1 id="heading1">Heading1</h1>


    BTW is your document XHTML or HTML? If the latter use
    <br> and not <br />

    --
    Take care,

    Jonathan
    -------------------
    LITTLE WORKS STUDIO
    http://www.LittleWorksStudio.com
     
    Jonathan N. Little, Feb 6, 2007
    #5
  6. Gary

    Andy Dingley Guest

    On 6 Feb, 12:32, "Gary" <> wrote:
    > Im just experimenting with internal linking.


    Don't use it if it's only a substitute for having pages short enough
    to comprehend without massive scrolling. Separate pages (still with
    nav links to them) generally make a better site than one huge "roll o'
    wallpaper"

    As an example, here's a guy who designs great gas burners, but bad web
    pages
    http://www.abana.org/ronreil/design1.shtml
    (I do bronze casting and forging with a couple of them)


    > The problem I have is that the page doesnt jump to the link, but only
    > the page the link is on.


    That's all it's expected to do. Exactly how a particular browser
    behaves is up to that browser's implementors and could be almost
    anything. Generally the link target will be scrolled until it's
    visible in the window, but they don't guarantee placing it right under
    the mouse cursor. Most of them try to minimise scrolling, so the
    effects vary depending on how long the page is and which direction you
    approached it from.

    > Here is my HTML: -


    That looks broadly OK, although repeated <br> is bad coding style and
    <br /> is wrong for HTML (it's XHTML, so either don't use it or search
    the ng. archives for why not to). You have the usual common error
    correct, in that you've used the "#" correctly.

    We don't generally like posted HTML fragments, preferring URLs to live
    sites. Sometimes there are typos or server config problems that aren't
    visible otherwise.

    The other poster's idea of substituting name attribute instead of id
    and in adding an explict <a name="..." > is obsolete coding style and
    wouldn't help anyway. I'd advise against doing it this way, although
    it isn't strictly wrong to do so.
     
    Andy Dingley, Feb 6, 2007
    #6
  7. Gary

    Gary Guest

    Jonathan thanks for clarifying that my original method was ok! i'm
    using the great tutorial html.net - and it's reassuring to know that I
    was doing the correct thing. The tutorial is teaching 'xhtml' so
    that's what i'm learning at the moment Jonathan!

    Andy - i'm using this just for learning, but i'll be sure to take heed
    of your advice!

    Mrcakey thanks also - as others suggested too, that was exactly the
    problem, no content below the page, once I added content it worked
    fine!

    Thankyou all!

    Gary.
     
    Gary, Feb 6, 2007
    #7
  8. Gary

    Ed Seedhouse Guest

    On 6 Feb 2007 04:57:22 -0800, "jim" <> wrote:

    >You've almost got it there Gary...
    >==========================================
    >Instead of this: <h1 id="heading1">Heading1</h1>
    >use this: <a name="heading1"/><h1 id="heading1">Heading1</h1>


    Er, I believe that would be invalid html since the A element is inline
    and you can't validly put a block element inside it. It should be done
    the other way around.
     
    Ed Seedhouse, Feb 6, 2007
    #8
  9. Gary

    Andy Dingley Guest

    On 6 Feb, 16:52, Ed Seedhouse <> wrote:

    > Er, I believe that would be invalid html since the A element is inline
    > and you can't validly put a block element inside it.


    Although that's true, the <a> element was closed before the <h1>
    anyway (and so it's actually valid). In HTML it would be closed _by_
    encountering the <h1>, in this example it's using the XML syntax for
    an empty element.

    <a ... ><h1>Foo</h1></a>
    would be straight-up wrong though.
     
    Andy Dingley, Feb 6, 2007
    #9
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Replies:
    6
    Views:
    501
    Andy Dingley
    Dec 27, 2003
  2. J. W. McCall
    Replies:
    3
    Views:
    380
    Bengt Richter
    Aug 6, 2003
  3. Jack
    Replies:
    0
    Views:
    789
  4. Replies:
    3
    Views:
    417
  5. Kevin Blakeley

    I know this is simple to do, but can't quite get it

    Kevin Blakeley, Oct 31, 2003, in forum: ASP .Net Building Controls
    Replies:
    1
    Views:
    110
    NoOne
    Oct 31, 2003
Loading...

Share This Page