jquery tab switching links so they jump to top of page?

Posted by Evan on Stack Overflow See other posts from Stack Overflow or by Evan
Published on 2010-06-02T00:10:21Z Indexed on 2010/06/02 0:13 UTC
Read the original article Hit count: 625

Filed under:
|
|
|
|

I was given some great help by redsquare to get this far to change jquery tabs from links within the content, but I have one more issue that I'm looking for support on...

When a user clicks a link to switch to a different tab from within the content, can i get the page to jump to the top of the page?

Within my demo link, scroll to the bottom of the page to click the links and they switch tabs just perfectly, which you can confirm if you scroll up.

So, I'm looking for the switch to also jump the user to the top of the page, so the user doesn't have to "scroll" to the top of the page to begin reading new content.

Here's my demo: http://jsbin.com/etoku3/11

Existing code:

<script type="text/javascript">
    $(document).ready(function() {
        var $tabs = $("#container-1").tabs();
        var changeTab = function(ev){
          ev.preventDefault();
          var tabIndex = this.hash.charAt(this.hash.length-1) -1;
          $tabs.tabs('select', tabIndex);
         };
        $('a.tablink').click(changeTab);
    });
</script> 

Thank you so much!

Evan

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about ui