MENU
Главная » Шаблоны и Скрипты для uCoz » Скрипты для uCoz » Слайдеры для uCoz

Слайдер V1 для uCoz

29.03.2015, 19:20
Выкладываю вам рабочий слайдер я его назвал V1 для вашего сайта.

Слайдер сможет выводить то что вы укажете в нём, это могут быть важные темы или разделы сайта. Вы сможете поменять картинки и текст в слайдере на тот который вам нужен.
Данный слайдер будет удобно и к месту вывести на главной странице вашего сайта для более удобной и быстрой информации, как я уже писал важных тем или разделов сайта.

Установка Слайдер V1 для uCoz:

В первую очередь вам нужно скачать архив с нашего сайта и загрузить папки images и js в корень вашего сайта.

Затем установите код слайдера в нужное для вас место, код слайдера находится в архиве в текстовом документе
Код слайдера

После того как вы установите код самого слайдера проследуйте в нижнюю часть вашего сайта и установите скрипты которые я указал ниже .

Код
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js?ver=1.3.2'></script>
<script type='text/javascript' src='/js/jquery.cycle.all.min.js'></script>
<script type='text/javascript' src='/js/presentationCycle.js'></script>
<script type="text/javascript">
  presentationCycle.init();
  </script>


Теперь остаётся установить сами стили сайта и для этого скопируйте стили так же которые я указал чуть ниже и сохраните их в самом низу ваших стилей сайта.

Код
h1, a {
  color: #DE8F26;
}

.pc_container {
  width: 600px;
  height: 200px;
  padding: 15px 1px 47px 1px;
  background-image: url('../images/pc_bg.png');
  margin: 0px auto;
}

.pc_container .pc_item {
  margin-top: 15px;
  margin-left: 1px;
  width: 600px;
  height: 200px;
}

.pc_container .pc_bar_container {
  position: absolute;
  top: 230px;
  color: white;
  padding: 0px 10px 0px 10px;
  width: 100%;
  overflow:visible;
}

.pc_bar_container_underflow {
  width: 90000px;
  overflow: visible;
}

.pc_bar_container_overflow {
  overflow: hidden;
  position: absolute;
  top: 230px;
  color: white;
  margin: 0px 10px 0px 10px;
  padding: 0px;
}

.left, .center, .right {
  background-position: left;
  background-repeat: no-repeat;
  overflow: hidden;
  font-size: 1px;
  float: left;
}

.bar {
  background-position: left;
  overflow: hidden;
  font-size: 1px;
  float: left;
}

.pc_item .desc {
color: #ffffff;
  position: absolute;
  width: 250px;
  padding: 10px;
  height: 180px;
  line-height: 1.8em;
  right: 0px;
  background-image: url(../images/slide_fade.png);
}

.pc_item .desc h1 {
  color: #DE8F26;  
}
  


На этом всё установка завершена !

Для того что бы поменять изображения вам нужно взять первичные с папки images они называются так

slide1,slide2,slide3,slide4, slide5,slide6

Вам нужно их заменить на свои, но только они должны называться так же как и первичные и размеры изображений должны быть как у исходников.
Категория: Слайдеры для uCoz | Добавил: Dimstrik
Просмотров: 436 | Загрузок:25 | Комментарии: 1 Скачать (343.9 Kb)




К сожалению, похожего ничего не нашлось!


Всего комментариев: 1
NataLy applause
Спасибо, классный слайдер, всё отлично работает!
Like | +1
Оставить свой комментарий

Используются технологии uCoz