» »

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


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

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

Код
<a href="#" class="gotop" title="Наверх" style="display: inline;"></a>  
  <style>.gotop {  
  position: fixed;  
  width: 85px;  
  height: 65px;  
  right: 20px;  
  bottom: 5px;  
  display: block;  
  background: url('http://zornet.ru/Ajaxoskrip/Fekstura_tekst/AgsaRtunet/h_1383469629_8306799_84e7bae818.png') no-repeat;  
  z-index: 9998;  
  display: none;opacity: 0.5;  
  }  
  .gotop:hover {opacity: 1.0;}</style>


Так она будет, если на ее не навести:



Здесь выставляем прозрачность opacity: 0.5; от 0.1 до 0.9 - так вы можете под дизайн сделать и с правой стороны будет, что можно изменить.
07.06.2016 Просмотров: 394 Комментарий: (3)

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

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

Комментарий: 3
Scheme
Scheme 07.06.2016 23:201
0
Так вы ще можете здесь свою кнопку поставить и эффект останется тот же, но если вы его не измените.
Сопрано
Сопрано 07.06.2016 23:232
0
Мне вот наоборот нравятся когда быстро страница взлетает, нет не какого разгону, это фишка уже прошлых лет.
Kosten
Kosten 07.06.2016 23:283
0
Если брать сам скрипт, он по сути простой, и просто стиль прозрачности добавлен.
avatar