Заработок в интернете и раскрутка вашего сайта Четверг, 28.03.2024, 17:55

Меню сайта
Категории раздела
Скрипты для uCoz [119]
Все скрипты uCoz для улучшения Вашего сайта
Статистика

Онлайн всего: 1
Гостей: 1
Пользователей: 0

Яндекс.Метрика Яндекс цитирования
Главная » Статьи » Скрипты для uCoz » Скрипты для uCoz

Слайдер изображений через плагин Craftyslide на jQuery для uCoz

Слайдер изображений через плагин Craftyslide на jQuery для uCoz

[ Скачать с сервера (2.2Kb) ]

Все порядком устали от тяжелых и навороченных слайдеров изображений. Мы долго искали что-то легкое и приятное на глаз, цвет и вкус, и наконец сошлись во мнении, что бесспорной позитивной новинкой среди слайдеров изображений может стать плагин CraftySlide от Ucoz. Так же можно прочитать и другую учебную литературу на Ulera.Net.

Как и все продукты, созданные с использование библиотеки ввода JQuery отличаются простотой в использовании и четкостью проработки. Создатели явно постарались,  и слайдер изображений вышел что надо. При просмотре изображений на сайте есть небольшой эффект затемнения, на котором контрастно и эффектно смотрится подпись к изображению.

Управление плагином так же легкое и требует всего одного нажатия мыши для смены картинки. На вашем сайте обязательно найдется место для этого стильного плагина, тем более, что он отлично подходит для оформления галерей изображений, легко встраивается в код страницы и не вызвал пока еще отрицательных отзывов при тестировании. Картинки сменяются очень плавно, что дает возможность хорошо рассмотреть изображение. Плагин CraftySlide, без сомнения, уже скоро привлечет внимание владельцев сайтов и дизайнеров благодаря своему хорошему исполнению и высокому качеству работы.

Мы уже попробовали этот новый плагин от Ucoz и можем рекомендовать его вам, но нам, в свою очередь, очень интересно мнение каждого пользователя.

ВАЖНО! Скрипт из прикреплённого архива залейте в папку js, а картинку в папку images

Установка:

В то место, где должен быть слайдер, вставляйте:

<divid="slideshow">
<ul>
<li>
<imgtitle="Титульник"src="Ссылка на картинку"alt="Титульник"/>
</li>
<li>
<imgtitle="Титульник"src="Ссылка на картинку"alt="Титульник"/>
</li>
<li>
<imgtitle="Титульник"src="Ссылка на картинку"alt="Титульник"/>
</li>
</ul>
</div>

<scriptsrc="/js/craftyslide.min.js"></script>
<scripttype="text/javascript">
$("#slideshow").craftyslide({
'width':640,
'height':300,
'pagination':true,
'fadetime':500,
'delay':500
});
</script>

В самый низ вашего css:

/*
Craftyslide CSS Styles
*/
#slideshow {
margin:0auto;
}
#slideshow {
margin:10px;
padding:0;
position:relative;
border:15px solid #f8f8f8;
-webkit-box-shadow:03px5px#999;
-moz-box-shadow:03px5px#999;
box-shadow:03px5px#999;
}
#slideshow ul {
position:relative;
overflow:hidden;
margin:0;
padding:0;
}
#slideshow ul li {
position:absolute;
top:0;
left:0;
margin:0;
padding:0;
list-style:none;
}
#pagination {
clear:both;
width:75px;
margin:25pxauto0;
padding:0;
}
#pagination li {
list-style:none;
float:left;
margin:02px;
}
#pagination li a {
display:block;
width:10px;
height:10px;
text-indent:-10000px;
background:url(/images/pagination.png);
}
#pagination li a.active {
background-position:010px;
}
.caption {
width:100%;
margin:0;
padding:10px;
position:absolute;
left:0;
font-family:Helvetica,Arial, sans-serif;
font-size:14px;
font-weight:lighter;
color:#fff;
border-top:1px solid #000;
background:rgba(0,0,0,0.6);
}



Нравится
Категория: Скрипты для uCoz | Добавил: admin (24.12.2013)
Просмотров: 461 | Рейтинг: 0.0/0


Нравится







Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]
Поиск
Наш баннер
Мы будем признательны,
если Вы разместите нашу кнопку
у себя на сайте!

Заработок в интернете и раскрутка вашего сайта


Языки
Заработок в интернете и продвижение вашего сайта © 2013-2024
Копирование материалов сайта без согласия запрещено!

Яндекс.Метрика

СЕГОДНЯ НАС ПОСЕТИЛИ:

200