ZorNet.Ru — сайт для вебмастера » Скрипты для uCoz » Кнопка вверх в разных тонах ucoz

Кнопка вверх в разных тонах ucoz

О скрипте:
Красивая подборка скриптов вверх сайта. Многие самые ходячие цвета. Это не все на сайте, на сайте большое количество шаблонов для сайта системы uCoz. Огромный архив скриптов, которые каждый день пополняются. Рабочий форум где вы для себя найдете что то новое и интересное. Так же на нем вам помогут если что то не понятно как по систем uCoz и компьютерная помощь. Если что то понравилось вы можете изложить все в гостевой книге и если не понравилось также можете там же изложить. Если обнаружите скрипт с багами просьба отписать в комментариях и мы исправим эту ошибку.
Приступаем к установке:
Устанавливать следует перед закрывающим тегом < .body>, в самый низ страницы

Code

2. Установка HTML
Обычная ссылка с классом, что прописан в js, вставляем в самый низ страницы.

Code

<a href="#" class="top_dm">Наверх</a>

3. Установка CSS
Теперь выбирайте какой стиль прописать в CSS, то есть каким цветом.
Светлая кнопка наверх:

Code

/* Светлая кнопка наверх
  ------------------------------------------*/
  .top_dm {
  font: 11px Verdana,Arial,Helvetica, sans-serif;
  color:#444;
  text-shadow:0 1px 1px #fff;
  cursor: pointer;
  position:fixed;
  bottom:-3px;
  right:50px;
  background:#D6D6D6;
  margin: 0px;
  padding:5px 10px 7px 10px;
  border:1px solid #909090;
  -webkit-border-radius:5px;
  -moz-border-radius:5px;
  border-radius:5px
  }

  .top_dm:hover{
  color:#444;
  background:#EAEAEA
  }

Синяя кнопка наверх:

Code

/* Синяя кнопка наверх
  ------------------------------------------*/
  .top_dm {
  font: 11px Verdana,Arial,Helvetica, sans-serif;
  color:#0b3d7a;
  text-shadow:0 1px 1px #fff;
  cursor: pointer;
  position:fixed;
  bottom:-3px;
  right:50px;
  background:#7db1f8;
  margin: 0px;
  padding:5px 10px 7px 10px;
  border:1px solid #0f76c5;
  -webkit-border-radius:5px;
  -moz-border-radius:5px;
  border-radius:5px
  }

  .top_dm:hover{
  color:#0b3d7a;
  background:#9dc7ff
  }

Красная кнопка наверх:

Code

/* Красная кнопка наверх
  ------------------------------------------*/
  .top_dm {
  font: 11px Verdana,Arial,Helvetica, sans-serif;
  color:#7a0b0b;
  text-shadow:0 1px 1px #fff;
  cursor: pointer;
  position:fixed;
  bottom:-3px;
  right:50px;
  background:#f87d7d;
  margin: 0px;
  padding:5px 10px 7px 10px;
  border:1px solid #c50f0f;
  -webkit-border-radius:5px;
  -moz-border-radius:5px;
  border-radius:5px
  }

  .top_dm:hover{
  color:#7a0b0b;
  background:#ff9d9d
  }

28 Апреля 2012 Просмотров: 1996 Комментариев: (2)

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

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

Kosten

Комментарии: 1
Порядок вывода комментариев: Марковичь 12 Января 2016 04:56¹ 0 Чем интересен этот скрипт, что кнопка на месте стоит а не показывается.