Warning: Cannot use a scalar value as an array in /home/admin/public_html/forum/include/fm.class.php on line 757

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/include/fm.class.php on line 770

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/topic.php on line 737
Форумы портала PHP.SU :: как сделать плавный скрол до якорной ссылке

PHP.SU

Программирование на PHP, MySQL и другие веб-технологии

PHP.SU Портал

Главная

Помощь

Поиск

Поиск Яндекс Вакансии

Пользователи

Здравствуйте, Гость

( Вход · Регистрация · Правила форума )

Забыли пароль?

как сделать плавный скрол до якорной ссылке

Форумы портала PHP.SU » Клиентская разработка » JavaScript & VBScript (Модератор: armancho7777777)

Страниц (1): [1]

Без описания

Поиск в теме | Версия для печати

daimon0482	Отправлено: 01 Апреля, 2017 - 21:31:56
Новичок Покинул форум Сообщений всего: 26 Дата рег-ции: Март 2017 Помог: 0 раз(а)	Здравствуйте есть такой код: <input class="hide" id="hd-1" type="checkbox" onclick="location.href='#nazakaz'" > <label class="zakaz" for="hd-1">Заказать</label> <div class="zakaz" > <a id="nazakaz"></a> Скрытое содержание...... </div> при нажатие на лабел открывается скрытый блок на много ниже чем кнопка по страничке, благодаря функции onclick="location.href='#nazakaz'" меня перекидывает к этому блоку моментально, как сделать боле плавный переход ?

andrewkard	Отправлено: 01 Апреля, 2017 - 23:34:28
Участник Покинул форум Сообщений всего: 1372 Дата рег-ции: Нояб. 2014 Помог: 30 раз(а)	Наверное как то так: http://jsfiddle[dot]net/0uwg96sh/ (Добавление) C jQuery можно так: CODE (javascript): скопировать код в буфер обмена $("#button").click(function() { $('html, body').animate({ scrollTop: $("#elementtoScrollToID").offset().top }, 2000); });

daimon0482	Отправлено: 02 Апреля, 2017 - 00:14:55
Новичок Покинул форум Сообщений всего: 26 Дата рег-ции: Март 2017 Помог: 0 раз(а)	нет не получилась к сожалению.

quad	Отправлено: 02 Апреля, 2017 - 12:23:12
Новичок Покинул форум Сообщений всего: 39 Дата рег-ции: Март 2017 Откуда: Россия Помог: 0 раз(а)	вроде так (Отобразить) CODE (htmlphp): скопировать код в буфер обмена <script> $(document).ready(function(){ $('#hd-1').click(function(){ // скорость скролла var speed = 1000; // место скролла var top = $('.zakaz').offset().top; $('html, body').animate({scrollTop: top}, speed); return false; }); });</script> <input class="hide" id="hd-1" type="checkbox"> <label class="zakaz" for="hd-1">Заказать</label> <div class="zakaz" > <a id="nazakaz"></a> Скрытое содержание...... </div> и в блок head вот это <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> (Добавление) quad пишет: вроде так (Отобразить) CODE (htmlphp): скопировать код в буфер обмена <script> $(document).ready(function(){ $('#clickto').click(function(){ // скорость скролла var speed = 1000; // место скролла var top = $('#scrollto').offset().top; $('html, body').animate({scrollTop: top}, speed); return false; }); });</script> <input class="hide" id="hd-1" type="checkbox"> <label class="zakaz" for="hd-1" id="clickto">Заказать</label> <div class="zakaz" id="scrollto" > <a id="nazakaz"></a> Скрытое содержание...... </div> и в блок head вот это <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

daimon0482	Отправлено: 03 Апреля, 2017 - 11:55:58
Новичок Покинул форум Сообщений всего: 26 Дата рег-ции: Март 2017 Помог: 0 раз(а)	не получается. #elementtoScrollToID"=вместо этого ставлю ид анкора? #button= а здесь ид inputa ? и все равно не хочет.

andrewkard	Отправлено: 03 Апреля, 2017 - 20:37:53
Участник Покинул форум Сообщений всего: 1372 Дата рег-ции: Нояб. 2014 Помог: 30 раз(а)	Разместите код на https://jsfiddle.net/, посмотрим

Поиск в теме | Версия для печати

Страниц (1): [1]

Сейчас эту тему просматривают: 0 (гостей: 0, зарегистрированных: 0)

« JavaScript & VBScript »

Все гости форума могут просматривать этот раздел.
Только зарегистрированные пользователи могут создавать новые темы в этом разделе.
Только зарегистрированные пользователи могут отвечать на сообщения в этом разделе.