Кнопка вверх с плавной автопрокруткой - Кнопки - UCOZ - Каталог файлов - Каморка
kamorka
Menu
Правила чата
Пользователи онлайн
Мини-чат
+Мини-чат
0
Онлайн всего: 1
Гостей: 1
Пользователей: 0
   Категории

Комментарии

KaMoRkA.uCoz.com -- uCoz -- Кнопки


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

Здесь вы можете выбрать любой дизайн кнопки, который находиться на файлах, скачиваем и меняем в CSS, что идет в материале.

Код
<style>  
#top{bottom:300px;cursor:pointer;display:none;font-size:150%;position:fixed;right:20px;opacity:0.7;}  
#top:hover{opacity:1;}  
</style>  
<div id="top"><img id="top_img" src="http://zornet.ru/Aben/ABGEA/FT/rynud/top.png" width="64" height="64" alt="top" /></div>  

<script type="text/javascript">  
var top_show = 250;  
var delay = 300;  
var slow_delay = 6000;  
$(window).scroll(function () {  
  if ($(this).scrollTop() > top_show) $('#top').fadeIn();  
  else $('#top').fadeOut();  
});  
$('#top').mouseover(function () {  
  $('body, html').animate({  
  scrollTop: 0  
  }, slow_delay);  
});  
$('#top').mouseout(function () {  
  $('body, html').animate().stop();  
});  
$('#top_img').click(function () {  
  $('body, html').animate().stop();  
  $('body, html').animate({  
  scrollTop: 0  
  }, delay);  
});  

$('.single-content img').parent('a').colorbox({transition:"none", width:"auto", height:"85%"});  
</script>

Важно!

При копировании материала указывать ссылку на источник.

- 330
- 10-Сентября-2017
- 0
Материал разместил:

Похожий материал
Статьи сайта