Jigs
Jigs

Reputation: 401

Jquery direct users to a specific anchor tag

I am sure I could search for this if I knew the words to describe what I am looking for.

I have a link that when pressed directs the user to another anchor tag using href="#anchorTagName"... however the link also has an onclick function which makes the div visible that anchorTagName is contained within. As a result the user is never directed to the anchor tag as they fire in the wrong order.

SO how do I make the div visible first and then have the user directed to the anchor tag?

Upvotes: 3

Views: 304

Answers (4)

Pirozek
Pirozek

Reputation: 1270

Look at this page, maybe it will help you :) http://blog.rebeccamurphey.com/2007/12/04/anchor-based-url-navigation-with-jquery/

Upvotes: 0

David Hoerster
David Hoerster

Reputation: 28701

Hopefully this is what you're trying to do....

<html>
    <head>
        <script type='text/javascript' src='http://code.jquery.com/jquery-1.4.2.min.js'></script>
        <script type='text/javascript'>
            $(document).ready(function() {
                $('#theAnchorTheUserClicks').click(function(e) {
                  e.preventDefault();  //prevent the default click action
                  $('#divToShow').show('fast',function() {  //show the div
                    $('#newText').focus();  //set the focus where you want
                  });
                });
            });
        </script>
    </head>
    <body>
        <a id='theAnchorTheUserClicks' href='#newAnchor'>click me</a>
        <div style='display:none' id='divToShow'>
            <a id='newAnchor'>Here I am!</a>
            <input type='text' id='newText'></input>
        </div>
    </body>
</html>

Upvotes: 1

ScottS
ScottS

Reputation: 72261

When defining the click event on page load, strip the href from the link and use the value in your click event function to change the page url after you have done your script to reveal the div.

Upvotes: 0

Yisroel
Yisroel

Reputation: 8174

You can use jQuery ScrollTo to scroll to the div you just made visible.

Most probably, your onclick event is preventing the default by retuning false or using event.preventDefault(). Remove that code to allow the default event to happen.

Upvotes: 0

Related Questions