Nivo Slider для uCoz

Рейтинг:3.5

Отличный слайдер для вашего сайта, подойдёт для сайтов с тёмным дизайном сайта

Установка:

В верхнюю или нижнюю часть сайта установите данный код:

Code

Заходим в админ панель => Инструменты => Информеры => Создать информер:
И создаём информер новостей, с нужными вам параметрами, советую установить количество материалов: 5 или 7

В шаблон информера ставим код:

Code

В то место где хотите увидеть информер вставьте данный код:

Code

<div id="slider" class="nivoSlider">
$MYINF_1$
  </div>

$МYINF_1$ - заменяем над свой код информера

В css вставляем этот код:

Code

/* меняем размер изображений высоту и ширину */
#slider {
  position:relative;
  width:500px;
  height:100px;
  background:url('loading.gif') no-repeat 50% 50%;
}

#slider img {
  position:absolute;
  top:0px;
  left:0px;
  display:none;
}

#slider a {
  border:0px;
  display:block;
}

/* выравниваем по центру квадраты переключателя */
.nivo-controlNav {
  position:absolute;
  left:180px;
  bottom:-25px;
}

.nivo-controlNav a {
  display:block;
  width:22px;
  height:22px;
  background:url('bullets.png') no-repeat;
  text-indent:-9999px;
  border:0;
  margin-right:3px;
  float:left;
}

.nivo-controlNav a.active {
  background-position:0 -22px;
}

.nivo-directionNav a {
  display:block;
  width:30px;
  height:30px;
  background:url('arrows.png') no-repeat;
  text-indent:-9999px;
  border:0;
}
a.nivo-nextNav {
  background-position:-30px 0px;
  right:15px;
}

a.nivo-prevNav {
  left:15px;
}

.nivo-caption {
  text-shadow:none;
  font-family: Helvetica, Arial, sans-serif;
}
.nivo-caption a {
  color:#efe9d1;
  text-decoration:underline;
}

.clear {
  clear:both;
}

.nivoSlider {
  position:relative;
}

.nivoSlider img {
  position:absolute;
  top:0px;
  left:0px;
}

.nivoSlider a.nivo-imageLink {
  position:absolute;
  top:0px;
  left:0px;
  width:100%;
  height:100%;
  border:0;
  padding:0;
  margin:0;
  z-index:6;
  display:none;
}

.nivo-slice {
  display:block;
  position:absolute;
  z-index:5;
  height:100%;
}

.nivo-box {
  display:block;
  position:absolute;
  z-index:5;
}

/* Полупрозрачный чёрный фон */
.nivo-caption {
  position:absolute;
  left:0px;
  bottom:0px;
  background: url('fon_nivo-caption.png') repeat;
  font:11px Verdana,Arial,Helvetica, sans-serif; color:#fff; font-weight: bold;
  width:100%;
  z-index:8;
}

.nivo-caption p {
  padding:6px;
  margin:0;
}
.nivo-caption a {
  display:inline !important;
}
.nivo-html-caption {
  display:none;
}

.nivo-directionNav a {
  position:absolute;
  top:25%;
  z-index:9;
  cursor:pointer;
}

.nivo-prevNav {
  left:0px;
}
.nivo-nextNav {
  right:0px;
}

.nivo-controlNav a {
  position:relative;
  z-index:9;
  cursor:pointer;
}
.nivo-controlNav a.active {
  font-weight:bold;
}