Когда занимаешься дизайном и раскруткой блога, приходится часто перемещаться вверх и вниз страницы. Когда мне надоело листать, я нашел реализацию прокрутки через кнопку вверх. Простой вариант "наверх", который можно увидеть у меня на страничке в блоге на WordPress - http://andercomp.ru, в самом низу меня не устроил. Но если кому надо, делается простым кодом -- Наверх.

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

Плагин "gotopbottom" для MaxSite CMS можно найти через поиск. Для WordPress плагин называется "Кнопка Вверх", НО пришлось выковыривать лишний код вместе со ссылкой. Потом перенесу его в сам шаблон, а Вам рекомендую проверять плагины на вшивость!

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

Ну а мне осталось найти код для прокрутки вниз, переделать рисунок, чтобы кнопка была и вверх и вниз. Уже нашел, как это реализовать через CSS и один рисунок. Хотя код тоже по большому счету один, направление главное указать. Скорее всего попробую разобраться и проверить свои догадки сам на своем блоге. Лишний опыт никому не помешает.

Если нужен сам плагин, пишите, выложу отредактированный от лишних ссылок. А со временем, возможно, и с движением в обе стороны.

Обновление. Для сайта на wordpress нашел такой простой код. Ставится в footer, кнопочки находятся самостоятельно и прописываются в коде вместо img src="http://andercomp.ru/кнопка.png" . В итоге получаем кнопки вверх-вниз. Следующим исправлением в этом коде, я планирую кнопки сделать через css.

<div style= "position:fixed; right:0.1%; bottom:45%;" id="nav_up">
<img src="http://andercomp.ru/up.png" alt="В верх страницы" 
title="В верх страницы" border="0"/></div>
<div style= "position:fixed; right:0.1%; bottom:41%;" id="nav_down">
<img src="http://andercomp.ru/down.png" alt="В низ страницы " 
title="В низ страницы" border="0"/></div>
 
 
      <script type="text/javascript">
        jQuery(function() {
            var overelem = jQuery('body');
 
            jQuery('#nav_up').fadeIn('slow');
            jQuery('#nav_down').fadeIn('slow');  
 
            jQuery('#nav_down').click(
              function (e) {
 jQuery('html, body').animate({scrollTop: overelem.height()}, 800);
              }
            );
            jQuery('#nav_up').click(
              function (e) {
 jQuery('html, body').animate({scrollTop: '0px'}, 800);
              }
            );
            });
        </script>

Не забывайте поправлять код под СВОЙ сайт!