JQuery слайдер изображений и контента с автоматической прокруткой
Очень стильный слайдер с автоматической прокруткой слайдов с разнообразной анимацией смены изображений. Этот слайдер также прокручивает и контент (текст) вместе с изображением. Слайдер работает на jQuery версии 1.6.1. Вы его можете использовать в качестве слайд-шоу на главной странице вашего сайта. Вес данного jQuery слайдера небольшой, так что загружатся он будет очень быстро, а версия jQuery 1.6.1 не будет конфликтовать с другими скриптами вашего сайта.
Смена слайдов происходит довольно плавно и подкреплена анимацией, в основном построенной на исчесзновении в разные стороны частей изображения. Думаю этот слайдер может приглянуться вам. Смотрим демонстрацию, качаем архив. Всем советую просмотреть другие слайдеры, которые есть в моем блоге.
Слайд-шоу фоновых изображений с использованием css3
Очень красивое слайд-шоу фоновых изображений с автоматической прокруткой слайдов и css3 анимацией. Фоновый слайдер работает на скриптовом языке программирования javascript - modernizr. В данном плагине имеется 4 варианта прокрутки фоновых изображений: просто плавное появление и прокрутка с таким же плавным появлением текста, приближение картинки и ее поворот, а также вариациии появления заголовков слайдов - с боку, с верху и с низу. Данный слайдер подойдет к любому сайту. Также его можно использовать как фоновое портфолио работ художника, фотографа и так далее.
Легкий слайдер контента с текстовой анимацией на CSS3 и jQuery
Очень практичный, легкий слайдер контента на CSS3 и jQuery. Отличительная особенность данного слайдера - текстовая анимация при переходе с одного слайда на другой. В любой слайд можно воткнуть любой html код. То есть в лайдере могут прокручиваться изображения, текста, заголовки, видео и так далее. Работает слайдер во всех современных браузерах последних версиях. К сожалению в версиях которые вышли 3-6 месяцев назад слайдер работает не корректно, поэтому не все посетители вашего сайта смогут насладиться этим слайд-шоу.
В этом слайдере применен атрибут css3 - animation. Советую подробнее ознакомиться с этим параметром css, так как с помощью него можно делать великолепные вещи.
На демонстрационной странице вы можете детально рассмотреть данный слайдер контента. Он представлен в двух версиях: статичный - с возможность прокрутки слайдов с помощью буллитов снизу или стрелочек по бокам, и автоматический - с автоматической прокруткой слайдов.
Горизонтальный резиновый jQuery слайдер изображений на сайт
Превосходная простая реализация резинового слайдера изображений. Слайдер крутится справа на лево по всей ширине монитора. Если вы посмотрите html код слайдера - вы обрадуетесь. Он очень легкий и понятный. Слайды идут друг за другом с равномерной скоростью (небольшой, но это можно изменить в файле js). Вся анимация работает на jQuery версии 1.3.2. Сам скрипт резинового слайдера называется jquery flexislider. Для одного моего проекта нужен был как раз такой слайдер (резиновый и сплошной, без рамок и расстояний между изображениями), я сначала поискал в интернете что-то типа этого, но не нашел. Начал делать сам, но неожиданно наткнулся на это решение.
Слайдер действительно очень легкий, аккуратный и неброский. Его можно использовать на сайте, как превьюшку ваших товаров. можно даже не ставит ссылки на них - это просто будет визуальная презентация вашей продукции, как бы вскользь. Такой слайдер служит на сайте для придания сайту динамики, живости. Он не прокручивается ни скролом, ни кнопками и может выступать как фоновый слайдер с резиновой растяжкой по ширине экрана. Этот jQuery слайдер можно применить, конечно же, не только к резиновым сайтам, но и сайтам с фиксированной шириной. Я собираюсь ешще немного переделать эту карусель изображений и использовать ее, как портфолио с ссылками на работы и слайд-шоу. Зделаю - выложу. А пока смотрите этот слайдер в работе и скачивайте его бесплатно с моего сайта.
Установка на сайт:
1. Скачайте архив и поместите папки их этого архива в корень вашего сайта.
Слайдер-просмотрщик изображений на jQuery для интернет-магазина
Потрясный по стилю и функционалу слайдер для интернет магазина. Удобный в установке на сайт и в пользовании посетителем. Слайдер представляет из себя главное изображение 366 на 200 пикселей и миниатюры отстальных изображений. При нажатии на миниатюру в главном окошке плавно меняется изображение на то, которое соответствует миниатюре. Также есть другой способ просмотра изображений: по правую и левую стороны от главного изображения есть небольшие стрелочки. Нажимая на них, вы можете просматривать изображения, не пользуясь миниатюрами (как говорится, кто как привык).
Слайдер-просмотрщик работает в любом современном браузере. Код этого слайд-шоу товаров в интернет магазине очень легкий и вам не составит труда поставить его на ваш сайт. Слайдер работает на jquery версии 1.4.4. Если у вас есть интернет магазин (или вы создаете его в это время) и планируется размещать товары с несколькими изображениями, то вам это слайдер придется к кстати. У меня уже была одна сборка, посвященная слайдеру-зуммеру для интернет магазина, вот ссылка на эту статью. Возможно тот слайдер вам тоже пригодится.
В демо версии очень хорошо показано как можно с помощью изображений шикарно показать и представить свой товар. В демо версии изображения посвящены кедам (7 изображений кед с разных ракурсов). Думаю вам захочется также хорошо представить клиенту товар, так точ качайте этот слайдер для интернет магазина и будет вам счастье)) Кстати, как вы уже видите - я поставил рекламу на свой блог и я буду очень признателен, если вы перейдете с моего сайт на нужное или понравившееся объявление)))) Тем самом вы можете сказать мне "Спасибо". Всего хорошего!))
Великолепный jQuery слайдер с плавным увеличением и уменьшением изображения
Отличный слайдер для сайта с автоматической прокруткой изображений и потрясным эффектом плавующий картинки. Изображения в слайдере двигаются снизу вверх, увеличиваются и уменьшаются. Все эффекты анимации идут в произвольном порядке. Я нашел этот слайдер на одном из шаблоне сайта, решил вытащить от туда (кстати вытащить у меня почему то не получилось)))), нарыл документацию по этой версии слайдера и вот готовый и свежий архив лежит перед вами.
Я разложил все по папочкам, убрал ненужный код, ссылки и так далее. Имея столь богатый функционал и несколько анимационных jQuery фишек, при всем при этом слайдер замечательно отображается во всех современных браузерах. управлять слайдером можно с помощью файла demo (советую вынести его в html файл):
Очень крутой слайдер! Он украсит любой сайт, любое портфолио, его можно поставить на главную страницу в качестве превью услуг или самых главных товаров. Слайдер прокручивает любой контент, а превью к тексту очень эффектно выезжает с боку (кстати есть 4 режима выезда этой текстовой панели. Также есть стрелочки для навигации по слайдеру, буллиты и табло с инфомрацией какой по счету сейчас показывается слайд. Не забываем кликать по яндекс-рекламке)) Всего хорошего!
Установка этого слайдера на сайт:
1. Качаем архив
2. Распаковываем его в корень вашего сайта через FTP менеджер
3. На странице вызова этого слайдера между тегами <head> и </head> прописываем следующий код:
Слайдер для сайта с постепенным появлением элементов слайда
Здравствуйте! Хочу представить вашему вниманию потрясающий анимационный баннер для сайта на CSS3. Его можно использовать как слайдер презентации продукта или услуг на главной странице сайта. Это не просто анимациооно перелистование слайдов: это пошаговое появление изображений и текста, которые есть в слайде. Именно поэтому я назвал это анимационным баннером. Мало того, что данный скрипт сложен в визуальзации, что придает дороговизну вашему сайту, но он еще и легок в установке на сайт. В нем один js-файл и один css-файл.
Сейчас я подробно распишу, как работает слайдер, а потом расскажу, как его поставить на сайт и что нужно знать, что бы поменять картинку или изменить динамику и сюжет каждого слайда. Во первых скажу, что я достаточно много провозился с этим слайдером, очищал его от кучи ненужного мусора (в виде картинов, css и js-файлов и лишнего кода). Во вторых скажу, что данный анимационный слайдер помог мне сделать презентацию на одном сайте, которая получилась достаточно неплохой и функциональной. Баннер представляет из себя четыре слайда, в котором есть некая инфомрация в виде текста и картинок. Каждая картинка и блок с текстом плавно выезжают сверху, снизу, справа или слева, и у каждого элемента задано свое время для появления. И так показаны четыре слайда с разной анимацией выезда информации.
Из навигации есть стрелочки, чтобы посмотреть следующий слайд или вернуться к предыдущему. Также есть буллиты, с помощью которых тоже можно управлять баннером, и индикатор времени смены слайдов в виде круга с движущейся красной полоской.
Установка анимационного баннера на сайт
1. Скачиваем архив с моего сайта, нажав кнопку "Скачать"
2. Распаковываем архив в корень вашего сайта
3. Прописываем пути к css и js файлам на странице, где у вас будет размещен этот баннер. Между <head> и </head> вставляем следующий код:
5 вариантов горизонтальной прокрутки изображений. jQuery карусель
Очень красивая реализация карсели на сайте. А тот факт, что в архиве 5 варинтов горизонтальной прокрутки изображений делает эту сборку обязательной для скачивания)) Конечно эти варианты мало чем отличаются друго от друга, но там присутствует немного различная анимация прокрутки изображений. Вообще карусель очень нужная вещь в web-хозяйстве, так как частенько кучу изображений на странице нужно кудо деть и web-разработчик прибегает к решению ставить карусель, которая скроет часть изображений и будет их выводить поочередно. кстати карусель называется "Elastislide".
jQuery карусель для новостного блога или интернет-газеты
Функциональная jQuery карусель для вывода краткой информации с картинкой и текстом. Эту карусель можно поместить на главную страницу вашего новостного блога. Получится очень хорошее решение для вывода последних новостей с ссылкой на саму новость. В данном архиве карусель представлена в двух видах, которые отличаются только цветом рамки и фона. Динамичная прокрутка изображений и текста осуществляется при помощи jQuery. Мне кажется, что на новостных сайтах нужно обязательно выводить превью новостей именно таким образом, так как этот плагин позволяет экономить место, а сами знаете - в новостных проектах (особенно на главной странице) места итак не хватает. Надеюсь данный плагин вам пригодиться.
Карусель картинок для Dominion
Скрипт берет картинки из модуля фотоальбом. Установка:
Создаем информер: Фотоальбомы · Материалы · В случайном порядке · Материалы: 20 · Колонки: 20
Вставляем в информер код:
Код