ZorNet.Ru — сайт для вебмастера » Скрипты для uCoz » Скрипт вверх и вниз для сайта с кнопками

Скрипт вверх и вниз для сайта с кнопками

Если у вас сайт фиксирован, то этот Скрипт вверх и вниз для сайта с кнопками который вам может пригодиться на вашем интернет ресурсе.
Сам он будет располагаться с правой стороны и будет иметь две кнопки.
Если вы подымаете страницу, то верхняя кнопка пропадает и остается нижняя, для того чтоб можно было опустить ее в низ.
Но я нашел на одном сайте подборку красивых кнопок, что из этого выходит, что вы можете их поставить. А просто сменить 2 ссылки, так как на две картинки идет.
И скачать архив и выбрать те кнопки которые вам нравятся и поставить их и на этом все.
Сам скрипт, ставим в низ сайта.
Там 2 ссылки в формате PNG вот их вы можете сменить, или оставить если вам понравятся те которые уже стоят.
Там малец поднятый вверх и в низ и все в синем оттенке цвета.

Код

<div id="banners"><a style='position: fixed; bottom: 60px; right: 1px; cursor:pointer; display:none;' href='#' id='Go_Top'>
  <img src="http://zornet.ru/CSS-ZORNET/ND/point-up.png" alt="Наверх" title="Наверх"></a>
  <a style='position: fixed; bottom: 20px; right: 1px; cursor:pointer; display:none;' href='#' id='Go_Bottom'>
  <img src="http://zornet.ru/CSS-ZORNET/ND/point-down.png" alt="Вниз" title="Вниз">
  </a></div>

<script>
var go_down = jQuery('body');
jQuery(function() {
  $("#Go_Top").hide().removeAttr("href");
  if ($(window).scrollTop() >= "250") $("#Go_Top").fadeIn("slow")
  var scrollDiv = $("#Go_Top");
  $(window).scroll(function() {
  if ($(window).scrollTop() <= "250") $(scrollDiv).fadeOut("slow")
  else $(scrollDiv).fadeIn("slow")
  });

  $("#Go_Bottom").hide().removeAttr("href");
  if ($(window).scrollTop() <= go_down.height()-"999") $("#Go_Bottom").fadeIn("slow")
  var scrollDiv_2 = $("#Go_Bottom");
  $(window).scroll(function() {
  if ($(window).scrollTop() >= go_down.height()-"999") $(scrollDiv_2).fadeOut("slow")
  else $(scrollDiv_2).fadeIn("slow")
  });

  $("#Go_Top").click(function() {
  $("html, body").animate({scrollTop: 0}, "slow")
  })
  $("#Go_Bottom").click(function() {
  $("html, body").animate({scrollTop: go_down.height()}, "slow")
  })
});
</script>

20 Июля 2014 Загрузок: 10 Просмотров: 2251 Комментариев: (0)

Поделиться в социальных сетях

СКАЧАТЬ

Материал разместил

Kosten

Комментарии: 0