JQuery вкладки переключения ссылок, чтобы они перейти на верх страницы? - PullRequest
0 голосов
/ 02 июня 2010

redsquare оказал мне большую помощь в изменении вкладок jquery по ссылкам в контенте, но у меня есть еще одна проблема, которую я ищу для поддержки ...

Когда пользователь щелкает ссылку для перехода на другую вкладку из содержимого, могу ли я заставить страницу перейти на верхнюю часть страницы?

В моей демонстрационной ссылке прокрутите вниз страницы, чтобы перейти по ссылкам, и они просто отлично переключат вкладки, что вы можете подтвердить, если прокрутить вверх.

Итак, я ищу переключатель для перехода пользователя на верх страницы, чтобы пользователю не приходилось «прокручивать» верх страницы, чтобы начать читать новый контент.

Вот мое демо: http://jsbin.com/etoku3/11

Существующий код:

<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> 

Ответы [ 2 ]

5 голосов
/ 02 июня 2010

Поместите это в функцию changeTab:

 $('body').scrollTop(0);

Ваш код:

$(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);

      $('html,body').scrollTop(0);  // Scroll to top
     };

    $('a.tablink').click(changeTab);

});

EDIT:

Если вы хотите анимировать его наверх, используйте вместо этого:

$('html,body').animate({scrollTop:0}, 500)
0 голосов
/ 02 июня 2010

window.location = "#"; Простая прокрутка в браузерах, которая может не поддерживаться старыми браузерами ...

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...