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.
Page 1 of 2 12 LastLast
Results 1 to 15 of 19
  1. #1
    Regular Coder
    Join Date
    Apr 2004
    Posts
    684
    Thanks
    24
    Thanked 1 Time in 1 Post

    Stop from jumping to top of page?

    Is there anyway to stop the page 'jumping to the top' when using a link like the below?

    Code:
    <a href="#" onClick="arrangeCards();">blah</a>
    .. I just want it to stay in the same position on the page & not jump to the top of the page every time a link like that is clicked.

    Cheers!

  • #2
    Regular Coder
    Join Date
    Jun 2002
    Location
    The Planet Earth Code Poet: True
    Posts
    282
    Thanks
    0
    Thanked 1 Time in 1 Post
    Try something like this:
    Code:
    <a href="#" onclick="arrangeCards();return false">blah</a>

  • Users who have thanked JohnKrutsch for this post:

    cyphix (09-11-2007)

  • #3
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,444
    Thanks
    11
    Thanked 598 Times in 578 Posts
    Quote Originally Posted by cyphix View Post
    Is there anyway to stop the page 'jumping to the top' when using a link like the below?

    Code:
    <a href="#" onClick="arrangeCards();">blah</a>
    Cheers!

    yes,
    way 1: don't use a fake anchor.
    Code:
    <span style="color:blue"  onClick="arrangeCards();">blah</span>

    way 2: use a real javascript anchor.
    Code:
    <a href="javascript:arrangeCards()" >blah</a>
    my site (updated 2014/10/20)
    BROWSER STATS [% share] (2014/9/03) IE7:0.1, IE8:4.3, IE11:9.2, IE9:2.7, IE10:2.6, FF:16.8, CH:47.5, SF:7.8, NON-MOUSE:37%

  • #4
    UE Antagonizer Fumigator's Avatar
    Join Date
    Dec 2005
    Location
    Utah, USA, Northwestern hemisphere, Earth, Solar System, Milky Way Galaxy, Alpha Quadrant
    Posts
    7,691
    Thanks
    42
    Thanked 637 Times in 625 Posts
    Only problem with that is IE6 doesn't support hover on non-anchor elements. I go with the <a href="#" onclick="arrangeCards();return false">blah</a> because it seems the most consistent on all browsers.

  • #5
    Regular Coder
    Join Date
    Feb 2005
    Posts
    679
    Thanks
    0
    Thanked 16 Times in 15 Posts
    Quote Originally Posted by cyphix View Post
    Is there anyway to stop the page 'jumping to the top' when using a link like the below?

    Code:
    <a href="#" onClick="arrangeCards();">blah</a>
    .. I just want it to stay in the same position on the page & not jump to the top of the page every time a link like that is clicked.
    When you use href="#" the URL resolves to
    Code:
    http://www.yoursite.com/current_page.html#
    and is looking for an anchor. That can cause you to 'go to the top'.

    You can target a name or id to handle this behavior.
    Code:
    <a href="#here">text</a>
    <a name="here"></a>
    "here" will be the target instead of the top of the page

  • #6
    Regular Coder
    Join Date
    Apr 2004
    Posts
    684
    Thanks
    24
    Thanked 1 Time in 1 Post
    Quote Originally Posted by JohnKrutsch View Post
    Try something like this:
    Code:
    <a href="#" onclick="arrangeCards();return false">blah</a>
    Thanks a bunch - worked a charm!

  • #7
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,642
    Thanks
    0
    Thanked 649 Times in 639 Posts
    To stop the link jumping to the top of the page when JavaScript is turned off you need to get rid of the link to the top of the page - the part that reads <a href="#"> is a link to the top of the page.

    If you don't want it to link to anywhere don't use an <a> tag - use a <span> and style it to look however you want.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #8
    Smokes a Lot
    Join Date
    Jul 2003
    Location
    CA, USA
    Posts
    1,594
    Thanks
    5
    Thanked 20 Times in 20 Posts
    While I realize this may not suit your needs, as you appear to be arranging cards or something, it should be noted that you can put an actual url in the href for non js users that will proceed to a page that can possibly process the desired code on the server side.

    Code:
    <a href="dostuffserverside.asp" onclick="doStuff();return false;">Do Stuff</a>
    Basscyst
    Helping to build a bigger box. - Adam Matthews

  • #9
    Regular Coder
    Join Date
    Apr 2004
    Posts
    684
    Thanks
    24
    Thanked 1 Time in 1 Post
    Thanks for the ideas guys - but yeah; the site is pretty javascript heavy & without it is pretty useless.

  • #10
    ubh
    ubh is offline
    Regular Coder ubh's Avatar
    Join Date
    Apr 2008
    Location
    Portland, Oregon U.S.A.
    Posts
    443
    Thanks
    108
    Thanked 15 Times in 14 Posts
    Note to self:

    Seems to be that the best solution is to use both methods to ensure that it works across all browsers and versions:

    Code:
    <a href="#undefined" onclick="someAction(); return false;" ....
    The above will:
    A) do a hunt on the page for another anchor link that has a name="undefined" but because there is none it will result in NO page jumping.
    B) The return false in the inline onclick event will (if js is enabled) stop any further actions upon completing the someAction() function.

    Easy to setup and is the best of both worlds if you ask me.

  • #11
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,863
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    Easy to setup and is the best of both worlds if you ask me.
    The best, IMO, is again what Basscyst had given. It ensures the basic service for all users.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #12
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,075
    Thanks
    0
    Thanked 256 Times in 252 Posts
    abduraooft is correct but it looks like this is a javascript game and as the original poster said, the page is heavy in javascript and without it, the page is useless and that link will probably not be visible or available.
    Last edited by glenngv; 02-09-2010 at 10:17 AM.
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________

  • #13
    New to the CF scene
    Join Date
    Feb 2010
    Location
    uk
    Posts
    7
    Thanks
    1
    Thanked 0 Times in 0 Posts

    page jumping to top

    hi everyone

    i dont know if anyone can help but i have a web site www.homebrewcentregy.com with a seprate shopping cart system. wich is very good and dont want to move, the point is when i add items to the cart i can eather go to the cart and back to the site by continue shopping or have it so i stay on the same page where i have it set at at the moment.

    but when i add to cart the page jumps to the top of the page and shows what is in the basket.is it possable when i add to the cart the item adds without moving and ( ? maybe ) when the button is clicked it will show an image like a green tick. here is the code to the button

    <form action='http://www.romancart.com/cart.asp' method=post>
    <input type=hidden name=itemcode value='1391'>
    <input type=hidden name=storeid value='XXXXX'>
    £<SCRIPT LANGUAGE="JavaScript" SRC="http://www.remoteprice.com/data.asp?storeid=XXXXX&itemcode=1391&type=1"></script>
    Qty:&nbsp;<input type=text name=quantity size=2 maxlength=6 value=1>&nbsp;<input type=submit value='Add to basket'>
    &nbsp;<SCRIPT LANGUAGE="JavaScript">document.write(roc_rdd_available_1391);</SCRIPT>
    </form>

    thankyou for your time shaun.

  • #14
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,864
    Thanks
    6
    Thanked 1,028 Times in 1,001 Posts
    Hi Shaun,
    The “problem” is that upon pressing the submit button the form is submitted to http://www.romancart.com/cart.asp and then processed on the server and then the page is reloaded to retreive the the results from that process. When a page is reloaded it is usually at the top again.

    What you need is to submit the page without reloading which can be achieved with an XMLHttpRequest object (commonly referred to as AJAX). Here is an example you can probably add to your site: http://www.simonerodriguez.com/ajax-...ubmit-example/

  • Users who have thanked VIPStephan for this post:

    shaunsc (02-10-2010)

  • #15
    New to the CF scene
    Join Date
    Feb 2010
    Location
    uk
    Posts
    7
    Thanks
    1
    Thanked 0 Times in 0 Posts
    still no luck i'm afraid i have very little knowledge of programing and need of a step by step guide PLEASE all help gratefully received
    thank you shaun. ( willing to make a donation on resolvement via pay pal )
    Last edited by shaunsc; 02-11-2010 at 11:39 AM.


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

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