Всем доброго дня! Дорогие друзья, спешу поделиться с вами довольно необычным виджетом для blogger. Обычно на сайтах установлены кнопки вверх или вниз и вверх. Панель состоящею из шести кнопок, я встретил первый раз. Помимо обычных функций кнопок вверх и вниз есть ещё такие как - в начало статьи, к концу статьи, авто прокрутка и стоп авто прокрутка.
Удивительно, по крайней мере для меня. Выглядит панель с кнопками вот так:
Как установить в Blogger кнопки вверх и вниз, Auto Scroll, Stop Scroll
Для установки в блог панели с кнопками, зайдите в blogger - шаблон - изменить HTML и выше тега </body> вставляем код:
<style> #dp-scroll{position:fixed;z-index:9999;bottom:0;right:0} #dp-scroll a{display:block;float:left;background-color:#09970F;background-image:url(http://lh5.ggpht.com/-wREw7V6WEsg/UYQq0-d5cWI/AAAAAAAABsI/vnH-wGlJp6s/s216/scroll.png);width:36px;height:36px;text-indent:-999em} #dp-scroll a.dp-up{background-position:0 -36px} #dp-scroll a.dp-down{background-position:0 -72px} #dp-scroll a.dp-bottom{background-position:0 -108px} #dp-scroll a.dp-scroll{background-position:0 -144px} #dp-scroll a.dp-stop{background-position:0 -180px} #dp-scroll a:hover{background-color:#064D09} </style> <script> function autoScroll(){window.scrollBy(0,1);scrolldelay=setTimeout('autoScroll()',50)} function stopScroll(){clearTimeout(scrolldelay)} </script> <div id='dp-scroll'> <a class='dp-top' href='javascript:window.scrollTo(0,0);' rel='nofollow' title='Наверх'>Наверх</a> <a class='dp-up' href='javascript:window.scrollBy(0,-window.innerHeight);' rel='nofollow' title='К началу страницы'>К началу страницы</a> <a class='dp-down' href='javascript:window.scrollBy(0,window.innerHeight);' rel='nofollow' title='К концу страницы'>Вниз страницы</a> <a class='dp-bottom' href='javascript:window.scrollTo(0,999999);' rel='nofollow' title='К футеру'>Вниз к футеру</a> <a class='dp-scroll' href='javascript:autoScroll();' rel='nofollow' title='Автопрокрутка'>Автопрокрутка</a> <a class='dp-stop' href='javascript:stopScroll();' rel='nofollow' title='Стоп Scroll'>Стоп Scroll</a> </div>
Название кнопок меняйте на любое. Цвет фона и при наведении курсора меняете здесь - #09970F; #064D09. Расположение панели - left (левый), если нужно поменяйте на право (right). Вот вроде и всё. Пока. До новых встреч.
С уважением, Сергей