Форум

Darth_Pandora · #1 (**permalink**) 12.05.2017, 16:19

Здравствуйте. Извиняюсь за такой глупый вопрос, я не в ладах с jquery, но сегодня вот потребовалась одна штука. Вообщем, при клике на li должна происходить анимация, страница должна спускаться к определенному div-u(точнее, ниже этого дива на 250px). Я написала код, но он что-то не особо работает. Из-за незнания синтаксиса не могу выловить ошибку. Была бы благодарна за помощь =)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
	<title>jQuery</title>
	<script src="https://yastatic.net/jquery/1.6.4/jquery.min.js"></script>
</head>
<body>

<li class="item-116">
<a href="www.111.ru">Товары</a>
</li>

<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>

<div id="elm">Тест</div>

<script>
	jQuery(function( $ ){
    $('li.item-116').click( function(){ 
	  $('body,html').animate({ scrollTop: $(scroll_el).offset().top-250}, 500); 
	    return false;
    });
});
</script>
</body>
</html>

Darth_Pandora · #2 (**permalink**) 12.05.2017, 16:27

Да, кстати, через <a href="#ap"> не предлагать, так как значение ссылки не должно блокироваться. (Общее для других страниц)

Darth_Pandora · #3 (**permalink**) 12.05.2017, 16:36

То есть он после выполнения этого скрипта переходит по ссылке. А мне нужно чтобы выполнил, анимация прошла и остановился.

рони · #4 (**permalink**) 12.05.2017, 17:06

Darth_Pandora,

лучше использовать более новую версию jquery

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
  <title>jQuery</title>
  <script src="https://yastatic.net/jquery/1.6.4/jquery.min.js"></script>
  <style type="text/css">
  body{
    height: 7000px;
  }

  </style>
</head>
<body>

<li class="item-116">
<a href="www.111.ru">Товары</a>
</li>

<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>

<div id="elm">Тест</div>

<script>
  jQuery(function( $ ){
    $('li.item-116').click( function(event){
      event.preventDefault();
    $('body,html').animate({ scrollTop: $('#elm').offset().top-250}, 500);
    });
});
</script>
</body>
</html>

Darth_Pandora · #5 (**permalink**) 12.05.2017, 17:26

Цитата:

лучше использовать более новую версию jquery

да, спасибо, это просто тестовая версия.

Вы меня просто спасли!

Благодарю.

И да, я была бы вам очень благодарна, если б вы скинули мне ссылочки где можно доступно почитать о синтаксисе. Я преимущественно на пхп пишу, в js редко лезу, но иногда приходится. И в такие моменты я вроде и пишу скрипт, понимаю как это должно строится, с точки зрения коддинга, но попадаю в такие вот глупые ситуации(

рони · #6 (**permalink**) 12.05.2017, 17:32

Darth_Pandora,
смотрите примеры в документации http://api.jquery.com/
или тут http://jquery.page2page.ru

Darth_Pandora · #7 (**permalink**) 12.05.2017, 20:29

рони, Огромное спасибо! =)

Форум

Справочник

Discord чат

Курсы javascript