Заработок в интернете и раскрутка вашего сайта Вторник, 16.01.2018, 20:27

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

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

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

Простой слайдер новостей и фото изображений на uCoz

Простой слайдер новостей и фото изображений на uCoz

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

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

Мы сталкивались с этой проблемой и искали, наши друзья и коллеги сталкивались и искали, и наконец, перебрав много вариантов, заценив все "за и "против", мы всем миром пришли к выводу, что один из лучших и заслуживающих внимания в этом случае - продукт Ucoz - самый легкий слайдер просмотра изображений. Написан традиционно с использованием JQuery. Вообще, любителям плагинов от Ucoz советуем следить за выходом новых версий библиотек JQuery, так как подавляющее большинство продуктов требуют их и только их. Скрипт подразумевает простое оформление и навигацию - с помощью мыши можно переключать изображения в любой последовательности. Оформление подходит для сайтов любой тематики и не имеет каких-то особенных элементов управления и навигации. Смена картинок происходит плавно, без рывков. Очень позитивное впечатление оставил легкий слайдер, так что всем советуем.

Важно: Скрипты из прикреплённого архива залейте в папку js

Установка:

После /head на нужных страницах вставляйте:

<scriptsrc="/js/jquery.scrollTo.js"></script>
<scriptsrc="/js/jquery.localscroll.js"></script>
<scriptsrc="/js/scripts.js"></script>

Следующий код в самый низ вашего css:

#slideshow {
width:918px;
height:546px;
overflow-x: scroll;
overflow-y: hidden;
margin:100pxauto50pxauto;
box-shadow:0px0px80px#000;
-moz-box-shadow:0px0px80px#000;
-webkit-box-shadow:0px0px80px#000;
}
#slideshow ul {
width:4590px;
list-style: none;
}
#slideshow ul li {
float: left;
}
#slideshow-nav {
width:300px;
margin:0auto200pxauto;
visibility: hidden;
}
#slideshow-nav ul {
list-style: none;
}
#slideshow-nav ul li {
float: left;
}
#slideshow-nav ul li a {
display: block;
width:30px;
height:30px;
float: left;
margin:010px;
background-color:#fff;
text-indent:-9999px;
border-radius:30px;
-moz-border-radius:30px;
-webkit-border-radius:30px;
box-shadow:0px0px30px#000;
-moz-box-shadow:0px0px30px#000;
-webkit-box-shadow:0px0px30px#000;
}
#slideshow-nav ul li a:hover, #slideshow-nav ul li a.active {
background-color:#a89d8a;
}
a {
outline: none;
}
a:focus {
background-color:#a89d8a;
}


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

<divid="slideshow">
<ul>
<liid="img1">
<a>
<imgsrc="Ссылка на картинку 1"/>
</a>
</li>
<liid="img2">
<a>
<imgsrc="Ссылка на картинку 2"/>
</a>
</li>
<liid="img3">
<a>
<imgsrc="Ссылка на картинку 3"/>
</a>
</li>
<liid="img4">
<a>
<imgsrc="Ссылка на картинку 4"/>
</a>
</li>
<liid="img5">
<a>
<imgsrc="Ссылка на картинку 5"/>
</a>
</li>
</ul>
</div>

<divid="slideshow-nav">
<ul>
<li><ahref="#img1">Пункт 1</a></li>
<li><ahref="#img2">Пункт 2</a></li>
<li><ahref="#img3">Пункт 3</a></li>
<li><ahref="#img4">Пункт 4</a></li>
<li><ahref="#img5">Пункт 5</a></li>
</ul>
</div>



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


Нравится







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

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


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

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

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

200