• Страница 1 из 1
  • 1
Форум Сталкер » Web-раздел » Скачать скрипты для сталкера » Плавная кнопка вверх для uCoz
Плавная кнопка вверх для uCoz
XemorDioДата: Понедельник, 04.04.2016, 12:47 | Сообщение # 1
Генерал-полковник
Группа: Пользователи
Сообщений: 897
Награды: 7
Репутация: 8
Статус: Offline


Вот такая кнопочка (вы можете видеть её в левом нижнем углу моего сайта, когда прокрутите страницу вниз), я считаю, должна быть на каждом сайте! Ещё бы, она так облегчает просмотр длинных страниц – не надо крутить страницу опять вверх, чтобы вернуться к меню, а нажал на кнопочку и – ты уже в начале страницы! К тому же это так красиво – страница красиво и плавно проматывается вверх, приятно смотреть Кнопочка размером 40x40, скрипт очень легкий и вы сможете спокойно подогнать под свой сайт.

Для начала в таблицу стилей вставляем код:
Код
.scrollup{width:40px;height:40px;position:fixed;bottom:200px;left:160px;display:none;text-indent:-9999px;background: url('http://webmaster-ucoz.ru/w-u/img/vverkh.png') no-repeat;opacity:0.5;}   
  .scrollup:hover{opacity:0.7;}


bottom:200px; - отступ с низу
left:160px; - отступ слева
http://webmaster-ucoz.ru/w-u/img/vverkh.png - картинку кнопки можете заменить на свою

В нижнюю часть сайта:
Код
<!-- <Вверх> -->   
  <a href="#" class="scrollup"></a>   
  <script type="text/javascript">   
  $(document).ready(function(){   
  $(window).scroll(function(){   
  if ($(this).scrollTop() > 700) {   
  $('.scrollup').fadeIn();   
  } else {   
  $('.scrollup').fadeOut();   
  }   
  });   
  $('.scrollup').click(function(){   
  $("html, body").animate({ scrollTop: 0 }, 600);   
  return false;   
  });   
  });   
  </script>   
  <!-- </Вверх> -->
 
Форум Сталкер » Web-раздел » Скачать скрипты для сталкера » Плавная кнопка вверх для uCoz
  • Страница 1 из 1
  • 1
Поиск:
Поделись с другими сталкерами
Меню сайта
Гость
Статистика
Интеллектуальный каталог ресурсов интернет