Всё для создания веб-сайта
Главная | Поиск | Обратная связь | Карта сайта | Версия для печати

Скроллинг страницы с панелью управления

Скроллинг страницы с панелью управления

Кнопки: наверх страницы, вниз страницы, автопрокрутка страницы вверх-вниз
Панель навигации не меняет своего положения во время прокрутки веб-страницы, её положение легко настраивается

пример html-кода:

<div id="staticbuttons" style="position: absolute;">
   <a onclick="scrollTo(0, 0); return false;" style="cursor: pointer;"><img src="article/arrow_top.gif" alt="" /></a>
   <p><a href="javascript:" onmouseover="myspeed=-thespeed" onmouseout="myspeed=0"><img src="article/arrow_up.gif" alt="" /></a></p>
   <p><a href="javascript:" onmouseover="myspeed=thespeed" onmouseout="myspeed=0"><img src="article/arrow_down.gif" alt="" /></a></p>
   <a onclick="scrollTo(0, document.body.clientHeight); return false;" style="cursor: pointer;"><img src="article/arrow_bottom.gif" alt="" /></a>
</div>

<script type="text/javascript">
var Hoffset = 260
var Voffset = 80
var thespeed = 3

var ieNOTopera = document.all && navigator.userAgent.indexOf("Opera") == -1
var myspeed = 0

var ieHoffset_extra = document.all ? 15 : 0
var cross_obj = document.all ? document.all.staticbuttons : document.getElementById ? document.getElementById("staticbuttons") : document.staticbuttons

function iecompattest()
   {
   return (document.compatMode && document.compatMode != "BackCompat") ? document.documentElement : document.body
   }

function positionit()
   {
   var dsocleft = document.all ? iecompattest().scrollLeft : pageXOffset
   var dsoctop = document.all ? iecompattest().scrollTop : pageYOffset
   var window_width = ieNOTopera ? iecompattest().clientWidth + ieHoffset_extra : window.innerWidth + ieHoffset_extra
   var window_height = ieNOTopera ? iecompattest().clientHeight : window.innerHeight

   if (document.all || document.getElementById)
      {
      cross_obj.style.left = parseInt(dsocleft) + parseInt(window_width) - Hoffset + "px"
      cross_obj.style.top = dsoctop + parseInt(window_height) - Voffset + "px"
      }
   else if (document.layers)
      {
      cross_obj.left = dsocleft + window_width - Hoffset
      cross_obj.top = dsoctop + window_height - Voffset
      }
   }

function scrollwindow()
   {
   window.scrollBy(0, myspeed)
   }

function initializeIT()
   {
   positionit()
   if (myspeed != 0) scrollwindow()
   }

if (document.all || document.getElementById || document.layers)
setInterval("initializeIT()", 20)
</script>

примечание: Смотри правый нижний угол страницы

Вернуться к списку

Авторизация
запомнить меня
Забыли свой пароль?
Поиск по сайту

Самое популярное

Статистика

Если вам понравился наш сайт, будем благодарны за размещение нашей кнопки на страницах Вашего сайта
как выглядит:

Учебник HTML, свойства CSS, сборник JavaScript, PHP скриптов

код нашей кнопки:

регистрация сайта в каталогах Заработай на своем сайте Заработай на своем сайте WOlist.ru - каталог сайтов Рунета