ScrollTop на JS для сайта uCoz - Скрипты - UCOZ - Каталог файлов - Каморка
kamorka
Menu
Правила чата
Пользователи онлайн
Мини-чат
+Мини-чат
0
Онлайн всего: 1
Гостей: 1
Пользователей: 0
   Категории

Комментарии

KaMoRkA.uCoz.com -- uCoz -- Скрипты


Неплохой вид scrollTop для системы uCoz. Данный scrollTop работает на JS, скрипт был адаптирован для uCoz. В scrollTop нечего лишнего. Требуется загрузить изображение на сайт. ScrollTop не шустрый сделал плавным, специально для uCoz. Все правильно поняли, кнопка вверх, которая выполнена в темной гамме гамме цвета плюс эффект при наведение на ее. И отлично подойдет на темный фон, где визуально отлично будет видна.

Приступаем к установке:

Копируем и устанавливаем в низ сайта, чтоб на всех страницах кнопка отображалась.

Код
<!--Кнопка вверх--><div class="arrow_up"></div>  
<script type="text/javascript"> $(".arrow_up").on('click',function(){$("html, body").animate({scrollTop:0},"slow");return false}); </script><!--/Кнопка вверх-->


CSS:

Код
/* Кнопка вверх */  
.arrow_up {  
width:33px;height:33px;position:fixed;z-index:50;right:50px;bottom:50px;cursor:pointer;  
background-image:url(http://zornet.ru/Aben/Gsa/zartyn/arrow_up.png);background-color:rgba(8,8,8,0.5);  
-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;  
opacity:.5;-moz-opacity:.5;-khtml-opacity:.5;  
filter:alpha(opacity=50);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";  
-moz-transition:opacity .5s;-webkit-transition:opacity .5s;  
-o-transition:opacity .5s;-ms-transition:opacity .5s;  
transition:opacity .5s;  
}  
.arrow_up:hover {  
opacity:1;-moz-opacity:1;-khtml-opacity:1;  
filter:alpha(opacity=100);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";  
}  
/* ---- * /

Важно!

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

- 376
- 03-Мая-2017
- 0
Материал разместил:

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