Страница 1 из 11
Форум » Скрипты для uCoz » Скрипты от нашего портала » JS слайдер изображений (Горизонтальный)
JS слайдер изображений (Горизонтальный)
Lexarus
Offline
Дата: Понедельник, 04.07.2011, 20:26 | Сообщение # 1
Постов: «3519»
Лучший админ

Данный слайдер придуман для листания изображений влево и вправо. JS слайдер изображений (Горизонтальный)
Установка:
Вставляем в CSS:
Code
/* CSOMSK.RU */
.infiniteCarousel
{
  position:relative
}

.infiniteCarousel .wrapper
{
  width:315px;
  overflow:auto;
  min-height:10em;
  margin:0 40px;
  top:0
}

.infiniteCarousel .wrapper ul
{
  width:9999px;
  list-style-image:none;
  list-style-position:outside;
  list-style-type:none;
  margin:0;
  padding:0;
  top:0
}

.infiniteCarousel ul li
{
  display:block;
  float:left;
  padding:10px;
  height:81px;
  width:113px
}

.infiniteCarousel ul li a img
{
  display:block
}

.infiniteCarousel .arrow
{
  display:block;
  height:36px;
  width:37px;
  background:url(http://csomsk.ru/img/arrow.png) no-repeat 0 0;
  text-indent:-999px;
  cursor:pointer;
  top:36px;
  position:absolute
}

.infiniteCarousel .forward
{
  background-position:0 0;
  right:3px
}

.infiniteCarousel .back
{
  background-position:0 -72px;
  left:5px
}

.infiniteCarousel .forward:hover
{
  background-position:0 -36px
}

.infiniteCarousel .back:hover
{
  background-position:0 -108px
}

/* -CSOMSK.RU- */

Вставляем код где хотим видеть слайдер:
Code
<script type="text/javascript" src="http://www.csomsk.ru/js/defolt.js"></script><table border="0" cellpadding="0" cellspacing="0" width="100%" class="eBlock"><tbody><tr><td style="padding:3px;"><div class="eTitle" style="text-align:center;">Онлайн сериалы:</div>
<div class="eMessage" style="text-align:center;clear:both;padding-top:2px;padding-bottom:2px;"><div class="infiniteCarousel">  
  <div class="wrapper">  
  <ul>  
  <li><a href="http://www.csomsk.ru/stuff/serialy/interny/5" title="Интерны"><img src="http://www.csomsk.ru/kino/intern.jpg" border="0" width="90"></a></li>
  <li><a href="http://www.csomsk.ru/stuff/serialy/luchshaja_okhrana_vzlom/6" title="Лучшая охрана"><img src="http://www.csomsk.ru/kino/vzlom.jpg" border="0" width="90"></a></li>
  <li><a href="http://www.csomsk.ru/stuff/serialy/gonka_drive/22" title="Гонка (DRIVE)"><img src="http://www.csomsk.ru/kino/gonka.jpg" border="0" width="90"></a></li>
  <li><a href="http://www.csomsk.ru/stuff/serialy/khodjachie_mertvecy/23" title="Ходячие мертвецы"><img src="http://www.csomsk.ru/kino/khodjashhie_mertvecy.gif" border="0" width="90"></a></li>
  <li><a href="http://www.csomsk.ru/stuff/serialy/nasha_russia_5_sezon/24" title="Наша Russia 5 сезон"><img src="http://www.csomsk.ru/kino/russia.jpg" border="0" width="90"></a></li>
  <li><a href="http://www.csomsk.ru/stuff/serialy/zakrytaja_shkola/25" title="Закрытая школа"><img src="http://www.csomsk.ru/kino/zakrit.jpg" border="0" width="90"></a></li>
  <li><a href="http://www.csomsk.ru/stuff/serialy/univer_5_sezon/26" title="Универ"><img src="http://www.csomsk.ru/kino/yniver.jpg" border="0" width="90"></a></li>
  <li><a href="http://www.csomsk.ru/stuff/serialy/ostatsja_v_zhivykh/27" title="Остаться в живых"><img src="http://www.csomsk.ru/kino/ostatsja_v_zhivykh.jpg" border="0" width="90"></a></li>
  <li><a href="http://www.csomsk.ru/stuff/serialy/terminator_khroniki_sary_konnor/28" title="Терминатор: Хроники Сары Коннор"><img src="http://www.csomsk.ru/kino/terminator.jpg" border="0" width="90"></a></li>
  <li><a href="http://www.csomsk.ru/stuff/serialy/sverkhestestvennoe/29" title="Сверхъестественное"><img src="http://www.csomsk.ru/kino/cverx.jpg" border="0" width="90"></a></li>
  <li><a href="http://www.csomsk.ru/stuff/serialy/barvikha_zolotye/30" title="Барвиха + Золотые"><img src="http://www.csomsk.ru/kino/barvikha.jpg" border="0" width="90"></a></li>
  <li><a href="http://www.csomsk.ru/stuff/serialy/zajcev_1/31" title="Зайцев +1"><img src="http://www.csomsk.ru/kino/zaicev.jpg" border="0" width="90"></a></li>
  <li><a href="http://www.csomsk.ru/stuff/serialy/realnye_pacany/32" title="Реальные пацаны"><img src="http://www.csomsk.ru/kino/real-pac.jpg" border="0" width="90"></a></li>
  </ul> </div> <br>
  </div></div></td></tr></tbody></table><br>
fander
Offline
Дата: Понедельник, 04.07.2011, 23:02 | Сообщение # 2
Постов: «332»
Гл. Модератор
Супер респект ЛёХа


DUMASS
Offline
Дата: Понедельник, 25.07.2011, 18:01 | Сообщение # 3
Постов: «2»
Рядовой
кул!!!!!!!

Сообщение отредактировал Lexarus - Понедельник, 25.07.2011, 19:14
Lexarus
Offline
Дата: Понедельник, 25.07.2011, 19:11 | Сообщение # 4
Постов: «3519»
Лучший админ
DUMASS, Лашара
Lex@_2009
Offline
Дата: Понедельник, 25.07.2011, 20:55 | Сообщение # 5
Постов: «419»
Cs Отец
Красава


Naikon
Offline
Дата: Среда, 27.07.2011, 03:56 | Сообщение # 6
Постов: «8»
Рядовой
Класс!

Сообщение отредактировал Lexarus - Среда, 27.07.2011, 10:24
Форум » Скрипты для uCoz » Скрипты от нашего портала » JS слайдер изображений (Горизонтальный)
Страница 1 из 11
Поиск: