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 8 of 8
  1. #1
    New to the CF scene
    Join Date
    Mar 2010
    Posts
    7
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Unhappy Navigation (hyper links) inside a webpage...?

    Hi,

    I'm working on a webpage which has a lot of information packed into it...

    I wanted to create a simple navigation inside the website, for example;


    .................................

    This section deals with;

    Q1 (click to go to this section)
    Q2 (click to go to this section)

    ......

    Heading: Q1

    bla bla bla

    (click here to go back to top of the page)

    .....

    Heading: Q2

    bla bla bla

    (click here to go back to top of the page)


    (click here to go back to the top of the page)
    ..........................

    I have seen some javascript codes which are just unbelievable complicated and advanced, how can I do this with the simplest of codes?


    I appreciate your time,
    Thanks!

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,734
    Thanks
    202
    Thanked 2,508 Times in 2,486 Posts
    This has nothing to do with Javascript.

    Code:
    <a name="pagetop"></a>
    
    <a href="#pagetop">Click here to return to the top of this page</a>

    To navigate to a different page:-

    Code:
    <a href = "mypage2.html">Go To Page 2</a>

    All advice is supplied packaged by intellectual weight, and not by volume. Contents may settle slightly in transit.

  • Users who have thanked Philip M for this post:

    Student23 (03-28-2010)

  • #3
    New to the CF scene
    Join Date
    Mar 2010
    Posts
    7
    Thanks
    2
    Thanked 0 Times in 0 Posts
    I tried to use the above mentioned technique with a button;

    <form>

    <input type="button" value="Go to Top of the Page" onClick="<a href="#pagetop"></a>">

    </form>

    &

    <form>

    <input type="button" value="Go to Top of the Page" onClick="#pagetop">

    </form>
    I tried a number of different ways but none of them work...

  • #4
    New to the CF scene
    Join Date
    Apr 2010
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    these should work if you have names the top section of the page.
    at the top of the page put:
    Code:
    <a name="pagetop"></a>
    Further Down the page (enough to create a scrollbar) put:
    Code:
    <a href="#pagetop">Click here to return to the top of this page</a>

  • #5
    New to the CF scene
    Join Date
    Mar 2010
    Posts
    7
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by adamck View Post
    these should work if you have names the top section of the page.
    at the top of the page put:
    Code:
    <a name="pagetop"></a>
    Further Down the page (enough to create a scrollbar) put:
    Code:
    <a href="#pagetop">Click here to return to the top of this page</a>
    That works fine, but i'm trying to incorporate the above method in a button.

    Thanks for your reply.

  • #6
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,734
    Thanks
    202
    Thanked 2,508 Times in 2,486 Posts
    As this is an anchor link you cannot use a button, but you can use an image:-

    <p align="center"><a href="#pagetop"><img src="topPage.gif" width="54" height="29" border="0"></a></p>

    and at the top of the page put

    <a name="pagetop"></a>

    If you insist on a button you can make an image which looks just like a button.

    You can use a button to link to another page:-

    Code:
    <form>
    <input type ="button" value = "Go to Google" onClick="parent.location='http://www.google.com'">
    <form>
    Last edited by Philip M; 04-08-2010 at 05:33 PM.

  • #7
    New to the CF scene
    Join Date
    Mar 2010
    Posts
    7
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Philip M View Post
    As this is an anchor link you cannot use a button, but you can use an image:-

    <p align="center"><a href="#pagetop"><img src="topPage.gif" width="54" height="29" border="0"></a></p>

    and at the top of the page put

    <a name="pagetop"></a>

    If you insist on a button you can make an image which looks just like a button.

    You can use a button to link to another page:-

    Code:
    <form>
    <input type ="button" value = "Go to Google" onClick="parent.location='http://www.google.com'">
    <form>
    What about linking to the same page instead of another page?


    <form>

    <input type="button" value="Go to Top of the Page" onClick="parent.location='home1.htm'">

    </form>
    It works perfectly fine now!

  • #8
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,734
    Thanks
    202
    Thanked 2,508 Times in 2,486 Posts
    Well that amounts to refreshing the page. Not exactly the same thing as moving to an anchor at the top of the page.


  •  

    Tags for this Thread

    Posting Permissions

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