Гость
Статистика Форума
Последнии темы Популярные темы Лучшии пользователи Новые пользователи
» [23.01.2019] Логотипчик для сайта (0)
» [22.01.2019] No Avatar для synthira (2)
» [22.01.2019] Различные иконки для игры или сайта Сталкер (12)
» [22.01.2019] Ui Icon Equipment (UIE) (0)
» [22.01.2019] Арты: Сталкер, апокалипсис, зона, конец света и... (8)
» [22.01.2019] Сталкер локации png (stalker maps png) (1)
» [22.01.2019] Различная графика для сайтов и игр (interface, ... (3)
» [22.01.2019] Иконки MISERY Stalker ui equipment (0)
» [22.01.2019] Фоны для сталкерского сайта (33)
» [22.01.2019] Игровые обои (1)
» Тайники и подсказки (82)
» FAQ прохождения по локациям DOPPELGANGER 7.63 Time Gap (50)
» Русскоязычное руководство по моду Frackin' Universe... (38)
» Фоны для сталкерского сайта (33)
» [DMX] Народное творчество (24)
» Capital-Rp Wikia Code (22)
» ГИД Прохождение остальных квестов ОП - 2 (21)
» CoC Вылеты и их решение (21)
» Личные сообщения (18)
» Редактирование мода «Народная солянка Объединенный пак ... (18)
» Xemordio (3150)
» NL-Vincenz (12)
» Infe[R]nos (10)
» Duzeppa26 (5)
» Ghosteron (4)
» gromgold (1)
» kamelotto (1)
» Glomar (1)
» Бармен (1)
» ZION (1)
» [22.01.2019] Likhatchevs
» [22.01.2019] starwind
» [19.01.2019] gavyxte
» [18.01.2019] Sedoy
» [17.01.2019] Nik_nikolaev2k18
» [13.01.2019] dextyar96
» [09.01.2019] max202
» [07.01.2019] Infe[R]nos
» [06.01.2019] zgenaz
» [01.01.2019] iivelesii

  • Страница 1 из 1
  • 1
Форум » Web uCoz » Скрипты для uCoz » Карусель банеров для uCoz (Вращающаяся карусель из банеров)
Карусель банеров для uCoz
Xemordio Offline Дата: Понедельник, 07.01.2019, 09:02 | Сообщение # 1
Администратор
Звание: Маршал [?]
Сообщений: 3150
Вращающиеся картинки банеры с эффектом карусели для установки на сайт или блог. Карусель из изображений можно применить для различных целей, может быть добавлено количество элементов крутящихся в карусели, а так же изменены размеры самого блока. Дополнительно добавлен эффект плавного мерцания, его так же можно настроить или убрать. Для работы карусели потребуется подключенная библиотека jQuery, на сайтах системы uCoz она уже подключена по умолчанию. Для установки добавьте код из примера в поле поддерживающее HTML редактирование, по умолчанию в настройках использовано расположение "по центру".

Пример кода для проверки настройки и установки
Внимание!!! в коде предоставленном ниже есть скрипт библиотеки jQuery, он выделен красным цветом. Перед установкой на сайтах uCozа, удалите скрипт библиотеки из кода. Дополнительно разными цветами выделены части элементов для добавления количества элементов в карусель.

Код
<script type="text/javascript" src="http://s36.ucoz.net/src/jquery-1.7.2.js"></script>
<style>
#block-carousel{
width:450px;
margin:0px auto;
background-color:transparent !important;
height:120px;
overflow:hidden;
}
#carousel-block{
position:relative;
width:450px;
height:120px;
float:left;
}
.carousel-foto{
height:31px;
left:0;
top:0;
width:88px;
position:relative;
margin:0px 0 0 10px;
float:left;
opacity:1;
-moz-animation: carousel-animation 2s ease-in-out 7s infinite alternate;
-webkit-animation: carousel-animation 2s ease-in-out 7s infinite alternate;
-ms-animation: carousel-animation 2s ease-in-out 7s infinite alternate;
}
@-moz-keyframes carousel-animation{
from {opacity:1;}
to {opacity:0.4;}
}
@-webkit-keyframes carousel-animation{
from { opacity:1;}
to {opacity:0.4;}
}
@-ms-keyframes carousel-animation{
from {opacity:1;}
to {opacity:0.4;}
}
@keyframes carousel-animation{
from {opacity:1;}
to {opacity:0.4;}
}
}
.carousel-element {
position:absolute;
top:auto;
bottom:0;
left:0;
}
</style>
<script src="//delaisait.ucoz.ru/script/baners/carousel/js/baner-carousel.js"></script>
<div id="block-carousel">
<div id="carousel-block">
<div class="carousel-foto">
<div class="carousel-element">
<a href="//cs-unity3d.ucoz.ru" target="_blank">
<img src="//delaisait.ucoz.ru/script/baners/carousel/img/baner-csunity3d.gif" alt="CS Unity 3D" height="31" width="88" />
</a>
</div>
</div>
<div class="carousel-foto">
<div class="carousel-element">
<a href="//delaisait.ucoz.ru" target="_blank">
<img src="//delaisait.ucoz.ru/script/baners/carousel/img/baner-delaisait.gif" alt="Делай сайт" height="31" width="88" />
</a>
</div>
</div>
<div class="carousel-foto">
<div class="carousel-element">
<a href="//shrift.ucoz.ru" target="_blank">
<img src="//delaisait.ucoz.ru/script/baners/carousel/img/baner-shrift.gif" alt="Русские шрифты" height="31" width="88" />
</a>
</div>
</div>
<div class="carousel-foto">
<div class="carousel-element">
<a href="//vk.com/merenkovmihail" target="_blank">
<img src="//delaisait.ucoz.ru/script/baners/carousel/img/baner-vk.gif" alt="Меренков Михаил ВКонтакте" height="31" width="88" />
</a>
</div>
</div>
</div> </div>


Карусель банеров в работе
Дата регистрации: 22.07.2017
Форум » Web uCoz » Скрипты для uCoz » Карусель банеров для uCoz (Вращающаяся карусель из банеров)
  • Страница 1 из 1
  • 1
Поиск:

06:03