Как сделать прокрутку до элемента?

Question

[hsnz]

Ребята, привет.
Помогите пожалуйста решить проблему, есть блок с информацией, устроен на js. На ПК он отлично работает, но хотелось бы, чтобы на мобильных устройствах при нажатии на определенный заголовок экран начинал опускаться до содержимого. Можно было бы сделать на анкор ссылках, но у меня в href="javascript:void(0)" стоит, поэтому не вариант.
Пример меню:

Сайт: revery.ru/test

Answer 1

[Алексей Скляров]

$('ul.menu a').on('click', function(e){
  var goto = $(this).data('anchor');
  $('html,body').stop().animate({ scrollTop: $(goto).offset().top-60 }, 1000);
  e.preventDefault();
});

Само меню:

<ul class="menu">
						<li><a href="#" data-anchor="#about">О компании</a></li>
						<li><a href="#" data-anchor="#features">Услуги</a></li>
						<li><a href="#" data-anchor="#calculate">Онлайн расчет</a></li>
						<li><a href="#" data-anchor="#faq">Ответы на вопросы</a></li>
					</ul>

В data-anhor указываете ID блока, до которого прокручивать при клике по ссылке.

Comments

[hsnz]

Алексей Скляров Алексей спасибо за помощь, все сделал как вы написали, но у меня не работает прокрутка, суть в том, что меню у меня не в списке ul, а просто div в нем уже остальные ссылки.
Вот пример меню:

<div class=yourself-links>
<a href="javascript:void(0)" data-anchor="#stm" class="yourself-link active">
Разработка товаров СТМ (Товаров под вашим брендом)
</a>
<a href="javascript:void(0)" data-anchor="#textile" class=yourself-link>
Дистрибьюторам
</a>
<a href="javascript:void(0)" class=yourself-link>
Магазинам FMCG\DIY
</a>
<a href="javascript:void(0)" class=yourself-link>
Магазинам мебели\текстиля\товаров для дома
</a>
<a href="javascript:void(0)" class=yourself-link>
Магазинам ортопедической продукции\спортивных товаров\аптеки
</a>
<a href="javascript:void(0)" class=yourself-link>
Магазинам товаров для детей
</a>
<a href="javascript:void(0)" class=yourself-link>
Интернет-магазинам
</a>
<a href="javascript:void(0)" class=yourself-link>
Гостиницам
</a>
</div>

[Алексей Скляров]

Так просто поменяйте селект:

$('a.yourself-links').on('click', function(e){
  var goto = $(this).data('anchor');
  $('html,body').stop().animate({ scrollTop: $(goto).offset().top-60 }, 1000);
  e.preventDefault();
});

[hsnz]

Алексей Скляров: не работает :(

[Алексей Скляров]

hsnz: Случайно добавил лишний символ S, исправил:

$('a.yourself-link').on('click', function(e){
  var goto = $(this).data('anchor');
  $('html,body').stop().animate({ scrollTop: $(goto).offset().top-60 }, 1000);
  e.preventDefault();
});

[hsnz]

Алексей Скляров: не работает прокрутка :(

[Алексей Скляров]

hsnz: проверял у себя. все нормально, возможно вы не подключили jQuery

[hsnz]

У меня стоит:

<script src="js/jquery.min.js"></script>
<script src="js/jquery.easing.min.js"></script>

[hsnz]

Алексей Скляров: заработало, спасибо, надо было скрипт вставить в тот файл где скрипт самого блока, а я его в html пихал.

Answer 2

[hsnz]

Как не пробую, не работает, не data-scroll, не data-anchor.

Comments

[hsnz]

Максим Ленский может вы поможете решить данную проблему?