Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 9 of 9
  1. #1
    New Coder
    Join Date
    Jun 2008
    Location
    Jupiter
    Posts
    49
    Thanks
    8
    Thanked 0 Times in 0 Posts

    name link issues

    Im trying to code a name link so that when an idnivdual click on the link, they will be sent to an area of my site with the specific code. Here is the code that i have:

    <a href="#D5"> Go to chapter two </a>
    <p> happy </p>

    <a name="D5"> chapter two </a>

    Any hints? Thanks.

  • #2
    Regular Coder optimus203's Avatar
    Join Date
    Sep 2008
    Location
    CT
    Posts
    317
    Thanks
    22
    Thanked 16 Times in 15 Posts
    If your trying to call the anchor that is on a different page from your source, you should use: <a href="page.html#d5">Chapter Two</a>

    If our calling from within the same page, you do not need to have content in our anchor name, just the name itself (unless of course you want to print out content): <a name="chapter2"></a>
    Always thank those CF Users who help you solve issues...
    Connecticut Web Design

  • #3
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,801
    Thanks
    160
    Thanked 2,216 Times in 2,203 Posts
    Blog Entries
    1
    NO! Never use the name attribute for the element(deprecated) to make such kind of anchor. Instead use the id attribute, so that you can target any element inside a document, like

    Code:
    <h2 id="heading2"></h2>
    
    
    <!-- will jump to the element with ID 'here' -->
    <a href="#heading2>link</a>
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #4
    New Coder
    Join Date
    Jun 2008
    Location
    Jupiter
    Posts
    49
    Thanks
    8
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by abduraooft View Post
    NO! Never use the name attribute for the element(deprecated) to make such kind of anchor. Instead use the id attribute, so that you can target any element inside a document, like

    Code:
    <h2 id="heading2"></h2>
    
    
    <!-- will jump to the element with ID 'here' -->
    <a href="#heading2>link</a>
    I dont get this example. I fixed the error in your code which was simple but you forgot to quote the attribute around heading2. However, by having a link that says link, how is this taking the indivdual to an designated spot on the page?

  • #5
    The Apostate Apostropartheid's Avatar
    Join Date
    Oct 2007
    Posts
    3,215
    Thanks
    16
    Thanked 265 Times in 263 Posts
    It's the fragment identifier which is the key. A link targeted at somewhere ending in a hash and a string (e.g. #cptr2) will tell the browser to search for an element with the ID of the fragment (e.g. <element id="cptr2"/>) and jump the viewport to that location. The name attribute used to be used instead of IDs, but this is now a deprecated practice.

  • #6
    New Coder
    Join Date
    Jun 2008
    Location
    Jupiter
    Posts
    49
    Thanks
    8
    Thanked 0 Times in 0 Posts
    Sorry i learn best by examples, mind giving an working example that uses "id," thanks.

  • #7
    The Apostate Apostropartheid's Avatar
    Join Date
    Oct 2007
    Posts
    3,215
    Thanks
    16
    Thanked 265 Times in 263 Posts
    Code:
    <?xml version="1.0" charset="utf-8"?>
    <!doctype html>
    <html xml:lang="en">
      <head>
        <title>Cats</title>
        <meta http-equiv="Content-Type"
          content="application/xhtml+xml; charset=utf-8"/>
      </head>
      <body>
        <h1>Articles on cats</h1>
        <ul>
          <li><a href="#noises">Noises</a></li>
          <li><a href="#appearance">Appearance</a></li>
        </ul>
        <h2 id="noises">Noises</h2>
        <p>Cats (colloq. &ldquo;kitties&rdquo;) make a sound which is spelt in different manners depending on region and preference. Most prevailant are the spellings <b>miaow</b> and <b>meow</b>. I like the first version. miaow!</p>
        <h2 id="appearance">
        <p>Cats are very small animals. They have tails&hellip;</p>
      </body>
    </html>
    That should show the behavior.

  • #8
    Senior Coder Rowsdower!'s Avatar
    Join Date
    Oct 2008
    Location
    Some say it's everything.
    Posts
    2,027
    Thanks
    5
    Thanked 397 Times in 390 Posts
    Quote Originally Posted by tokio View Post
    ...However, by having a link that says link, how is this taking the indivdual to an designated spot on the page?
    Hello and welcome to the forums. I just want to clarify that it doesn't matter what you type here:
    Code:
    <a href="#heading2">link</a>
    To illustrate, all of these links would have the same exact effect:
    Code:
    <a href="#heading2">link</a>
    <a href="#heading2">potato</a>
    <a href="#heading2">I like coffee</a>
    <a href="#heading2">where's the beef?</a>
    <a href="#heading2">this is not a link, it leads NOWHERE!</a>
    The functional portion of the code is this segment:
    Code:
    <a href="#heading2">link</a>
    The object of opening the mind, as of opening the mouth, is to shut it again on something solid. G.K. Chesterton
    See Mediocrity in its Infancy
    It's usually a good idea to start out with this at the VERY TOP of your CSS: * {border:0;margin:0;padding:0;}
    Seek and you shall find... basically:
    validate your markup | view your page cross-browser/cross-platform | free web tutorials | free hosting

  • #9
    Regular Coder optimus203's Avatar
    Join Date
    Sep 2008
    Location
    CT
    Posts
    317
    Thanks
    22
    Thanked 16 Times in 15 Posts
    NO! Never use the name attribute for the element(deprecated) to make such kind of anchor.
    Of course. Sorry, I'm a little sleep deprived...
    Always thank those CF Users who help you solve issues...
    Connecticut Web Design


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •