Как сделать скролл до блока?

Question

[DmitryRise]

Здравствуйте, использую данный код для того, чтобы по якорю открывалась нужная таба bootstrap, но к сожалению не получается сделать так, что по якорю был и скролл до нужного таба, подскажите, пожалуйста, в чем проблема?

var hash = window.location.hash;
  hash && $('ul.nav a[href="' + hash + '"]').tab('show');



  $('.nav-tabs a').click(function (e) {
    $(this).tab('show');
    var scrollmem = $('body').scrollTop();
    window.location.hash = this.hash;
    $('html,body').scrollTop(scrollmem);
  });

Answer 1

[Василий Варюхин]

Тут

P.S. Не стоит плодить однообразные темы.

upd 17:20. Я разобрался. Дело в том что нативная прокрутка не работает если якорь скрыт/не виден (что логично). И почему то якорь на name не работает когда есть тот же id а странице 0.о А у бутстрапа, блин, используется именно этот id для табов.

<div>

  <!-- Nav tabs -->
  <ul class="nav nav-tabs" role="tablist">
    <li role="presentation" class="active"><a href="#home" aria-controls="home" role="tab" data-toggle="tab">Home</a></li>
    <li role="presentation"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">Profile</a></li>
    <li role="presentation"><a href="#messages" aria-controls="messages" role="tab" data-toggle="tab">Messages</a></li>
    <li role="presentation"><a href="#settings" aria-controls="settings" role="tab" data-toggle="tab">Settings</a></li>
  </ul>

  <!-- Tab panes -->
  <div class="tab-content">
    <div role="tabpanel" class="tab-pane active" id="home">...</div>
    <div role="tabpanel" class="tab-pane" id="profile">...</div>
    <div role="tabpanel" class="tab-pane" id="messages">...</div>
    <div role="tabpanel" class="tab-pane" id="settings">...</div>
  </div>

</div>

Но! Если мы немного изменим код и припишем правильные id ссылкам которые видны всегда...

<div>

  <!-- Nav tabs -->
  <ul class="nav nav-tabs" role="tablist">
    <li role="presentation" class="active"><a href="#home-tab" id="home" aria-controls="home" role="tab" data-toggle="tab">Home</a></li>
    <li role="presentation"><a href="#profile-tab" id="profile" aria-controls="profile" role="tab" data-toggle="tab">Profile</a></li>
    <li role="presentation"><a href="#messages-tab" id="messages" aria-controls="messages" role="tab" data-toggle="tab">Messages</a></li>
    <li role="presentation"><a href="#settings-tab" id="settings" aria-controls="settings" role="tab" data-toggle="tab">Settings</a></li>
  </ul>

  <!-- Tab panes -->
  <div class="tab-content">
    <div role="tabpanel" class="tab-pane active" id="home-tab">...</div>
    <div role="tabpanel" class="tab-pane" id="profile-tab">...</div>
    <div role="tabpanel" class="tab-pane" id="messages-tab">...</div>
    <div role="tabpanel" class="tab-pane" id="settings-tab">...</div>
  </div>

</div>

Теперь если давать ссылки типа site.ru/tabs#message, то скролл будет работать.

Вот link#messages – Будет показана вкладка #message и скролл до нее работает без js.