Loading





Форекс с Альпари

eTXT




Анкетка


Галерея изображений на JQuery и CSS3


Информация, представленная на этой странице ориентирована в первую очередь для начинающих web-мастеров.

В этом уроке мы создадим привлекательную галерею. Идея состоит в том, чтобы показать каждый альбом в виде слайдера. При выборе альбома и щелчке мышью, произойдёт показ изображений из этого альбома. Здесь используются возможности JQuery и CSS3 для эффекта поворота изображений и частично PHP для вывода изображения с каждого альбома. Эффект успешно работает во всех современных браузерах.

Галерея изображений на JQuery и CSS3
Демо-пример Исходники (2.5 мб)

Если возникают проблемы при скачивании файлов, например, через браузер, скопируйте ссылку (правая кнопка мыши → копировать адрес ссылки) и скачайте файл через Download Master.


Установка на сайт


  1. Скачайте учебный материал, распакуйте в отдельную папку на компьютере;
  2. Подберите изображения в каждую из девяти папок, расположенных в папке albums. Малые изображения (превью - thumb.jpg) желательно, чтобы имели размеры 135x90 пикселов, а основные - 460x305. Названия основных изображений можно оставить оригинальные, так как они роли не играют;
  3. В индексном файле внесите доступные изменения (названия, текст объявлений и т.д.);
  4. Закачайте папку PhotoStack на сервер сайта и откройте индексный файл. Всё будет исправно работать!

Если имеете желание и потенциал, изменяйте настройки в файле стилей.

В рассматриваемом примере библиотека jQuery (jquery.min.js), версия 1.4.2, подключается удаленно с сайта //ajax.googleapis.com. Вы вправе использовать другие варианты подключения. Об этом прочтите здесь.

Спасибо за внимание. Посещайте мой сайт. Удачи! Пока! Ваш L.M.


Работа в интернете с текстами




Ваш комментарий







  © 2015–2018  https://leonidmuzyka.com/  L.M. Служба поддержки RSS подписка подписка