автоматическая прокрутка страницы

Привет, друзья. Предлагаю вам вариант автоматической прокрутки с кнопкой стоп. Раньше я уже писала пост про такую кнопку прокрутки, но его пришлось удалить, так как тот код "приказал долго жить". И посему предлагаю вам альтернативный вариант.

Представьте себе такую ситуацию. Накатила лень ничего не хочется делать. Сесть бы да почитать, что-нибудь эдакое для души. Да ещё бы с чашечкой кофе в руке. А то ведь уже и пальцы онемели, крутишь и крутишь это колёсико мыши. Сплошное однообразие.

Вот именно для такого случая, вернее для ленивых читателей, предлагаю вариант оригинальной кнопки.

Взгляните на неё на тестовом блоге справа.

Демонстрация

Устанавливается код в гаджет HTML/JavaScript в любом месте макета блога.

Код

<style>#abt-scroll{position:fixed;z-index:9999;bottom:0;left:10px;top:380px!important;}
#abt-scroll a{display:block;float:left;width:32px;height:32px;text-indent:-999em; padding: 3px!important;}
#abt-scroll a.abt-scroll{font-family:FontAwesome;border-radius:50%;}
#abt-scroll a.abt-stop{font-family:FontAwesome;margin-left:2px;border-radius:50%;}
#abt-scroll a.abt-stop{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg77ggFrjBhibCVjVYrYzw7tVRzeqduzRT7B6VQSOUsF96I2eY0q2BSLaJRIlW74uCGurMqZx8A17pztEui-_cX8Tokeki8ZGqdHsH6Zj3l34Hm6ME4c0DqsUHQcFNihmQtPNLYpES7ZifC/s1600/pause.png");}
  #abt-scroll a.abt-scroll{width:33px;height:33px;!important;}
 #abt-scroll a.abt-stop{width:34px;height:34px;}
#abt-scroll a.abt-scroll{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgonWtUbCoJJr_oJT2QgeaA5_D4_lmo7TfnWVZIjZuaRO73Jmj7YPUpnkIRmA-o9DZa8oJKt0WzMnJFB9drkwIq9YTu_BBA_imrNB8aAhcPiZ5BL3KuvEzz2abcVJ7v6NYrzR3IlOWQrKks/s1600/play.png");}</style>

<script type='text/javascript'>
function autoScroll(){window.scrollBy(0,1);scrolldelay=setTimeout(&#39;autoScroll()&#39;,60)}
function stopScroll(){clearTimeout(scrolldelay)}
</script>
<div id='abt-scroll'>
<a class='abt-scroll' href='javascript:autoScroll();' rel='nofollow' title='Play'>Play</a>
<a class='abt-stop' href='javascript:stopScroll();' rel='nofollow' title='Pause'>Пауза</a>
</div>

Вы можете изменить скорость прокрутки - 60. Размеры кнопок, отмеченных розовым цветом. Сами иконки кнопок.

Вот и всё. Всем добра и спасибо за визит.

👇

Получайте новые сообщения с блога прямо на почту

Введите Ваш email