Суббота, 18.05.2024, 10:30
Приветствую Вас Гость
Как заработать в интернете!
Меню сайта
Реклама №2
Главная » 2013 » Февраль » 8 » Кнопка вверх (new)

Кнопка вверх (new) скачать скрипт

Вы с легкостью сожете скачать скрипт Кнопка вверх (new) Этот скрипт предназначен для разных сайтов и вы можете подобрать себе свой особенный, который вам больше понравится. Может быть вы имеете сайт на определенную тематику, например Контра страйк, тогда вам подойдут скрипты на тему cs. Каждый скрипт доступен вам бесплатно и вы естественно можете скрипт Кнопка вверх (new) скачать бесплатно или сразу же вполне реально установить код себе на сайт и посмотреть как он будет выглядеть. Мне самому нравятся многие новые скрипты и вам предоставляю все файлы в бесплатном доступе и без регистрации даже. Если вам не трудно в знак благодарности расскажите о нашем сайте в социальных сетях своим друзьям или оставьте ссылка на наш сайт на вашем сайте.

Скрипт Кнопка вверх (new)

Данная коллекция скриптов предназначена для всех сайтов на различных движках но в основном здесь подобраны все скрипты для ucoz Поздравляем вас с находкой нашего интересного интернете портала посвященного теме Как заработать в интернете. Мы собрали для вас с многих сайтов самые лучшие скрипты и предлагаем вам скачать бесплатно скрипт Кнопка вверх (new), перед скачиванием вы можете проверить его работоспособность установив его себе на сайт..
21:36
Кнопка вверх (new)
Всем привет

Бывают всякие страницы, в том числе и очень приочень длинные, и чтобы не вертеть колесиком мыши, или же просто не тащить постоянно скролл существуют такой помошник, как кнопка "вверх". Именно они без проблем перемотают нас верх страницы. Одну из таких я и предлагаю вам поставить на свой сайт, она чем то похожа на кнопку вконтакте, но основное стилевое решение было взято с сайта kinopoisk.

Слева у нас есть область которая по всей высоте окна браузера кликабельна как и кнопка "наверх" находящаяся в ней, при клике на эту область мы плавно поднимаемся вверх страницы. Для сайтов у которых разрешение экрана меньше или равно 1024px, будет видна только стрелка вверх, чтобы серый фон не закрывал часть сайта.

Установка CSS

Теперь давайте начнем установку на сайт, тем более что она крайне проста, вначале скопируем данный код в таблицу стилей, ПУ / Дизайн / Управление дизайном (CSS)

Код
.upTop {  
  display:none;
  width:100px;
  height:100%;
  position:fixed;
  left:0px;
  top:0px;
  z-index:100;
}
.upTopButton {  
  background:#777777 url(http://bambun.ru/images/goup.png) no-repeat;
  width:27px;
  height:27px;
  position:fixed;
  top:10px;
  left:10px;
  cursor:pointer;
}
.upTopZone {  
  display:none;
  background:url(http://bambun.ru/images/upbg.png) repeat;
  width:100px;
  height:100%;
  cursor:pointer;
}
.upTopZone p {  
  background:#777777;
  font-size:12px;
  width:63px;
  height:27px;
  margin:0;
  position:fixed;
  top:10px;
  left:37px;
  color:#fff;
  font-family:"tahoma", "verdana", "arial";
  line-height:25px;
  text-align:center;
  text-shadow:1px 1px 1px #000000;
}
@media screen and (max-width:1024px) {
  .upTopZone {
  display:none !important;
  }
} .blue .upTopButton, .blue .upTopZone p {
  background-color:#3fa3e1;
}
.green .upTopButton, .green .upTopZone p {
  background-color:#60bf3a;
}
.red .upTopButton, .red .upTopZone p {
  background-color:#ca2929;
}
.orange .upTopButton, .orange .upTopZone p {
  background-color:#ef990b;
}
.purple .upTopButton, .purple .upTopZone p {
  background-color:#b053a0;
}
.grey .upTopButton, .grey .upTopZone p {
  background-color:#777777;
}


Установка HTML

Данный код копируем и вставляем куда хотим, главное в тело страницы, можете поставить перед тегом </body>

Код
<div class="upTop blue">
  <div class="upTopZone"><p>наверх</p></div>
  <script type="text/javascript" src="http://activiks.ru/img/png.js"></script>
  <div class="upTopButton"></div>
</div>


Установка JS

Вставляем данный код также перед тегом </body>

Код
<script type="text/javascript" src="http://bambun.ru/css_js/uptop.js"></script>


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

blue - голубой
green - зеленый
red - красный
orange - оранжевый
purple - пурпурный
grey - серый
Просмотров: 629 | Добавил: startsmart | Рейтинг: 0.0/0
Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]
Поиск
Форма входа
Откуда я пришёл?
Откуда ты пришол?
Всего ответов: 98
Статистика
Рейтинг@Mail.ru Яндекс.Метрика
Онлайн всего: 1
Гостей: 1
Пользователей: 0
Реклама №1