JQuery перемещение в место привязки при загрузке страницы

У меня есть простая настройка страницы, например:

<div id="aboutUs">
  About us content...
</div>
<div id="header">
  Header content...
</div>

Когда страница загружается, мне нужно, чтобы страница автоматически прокручивалась вниз (без анимации) до #header, поэтому пользователь не может видеть раздел "О нас", если они не прокручиваются вверх.

#aboutUs имеет фиксированную высоту, поэтому нет необходимости в каких-либо переменных для определения высоты или чего-то еще... если это необходимо.

Я встретил этот другой вопрос и попытался изменить некоторые ответы на мою ситуацию, но ничего не работало.

Любая помощь будет оценена.

Ответы

Ответ 1

Описание

Вы можете сделать это, используя методы jQuery .scrollTop() и .offset()

Посмотрите мой пример и демонстрация jsFiddle

Пример

$(function() {
    $(document).scrollTop( $("#header").offset().top );  
});

Дополнительная информация

Ответ 2

Вы пробовали метод JQuery scrollTo? http://demos.flesler.com/jquery/scrollTo/

Или вы можете расширить JQuery и добавить свой собственный ментод:

jQuery.fn.extend({
 scrollToMe: function () {
   var x = jQuery(this).offset().top - 100;
   jQuery('html,body').animate({scrollTop: x}, 400);
}});

Затем вы можете вызвать этот метод следующим образом:

$("#header").scrollToMe();

Ответ 3

Поместите это прямо перед закрывающим тегом Body в нижней части страницы.

<script>
    if (location.hash) {
        location.href = location.hash;
    }
</script>

jQuery на самом деле не требуется.