16:17 

Простая галерея на jQuery

Makha
Все в порядке... Во всяком случае, в конечном итоге все будет в полном порядке!
В связи с грядущим Новым годом оказалась я без срочной работы, и с заданием - выучить jQuery. Оно, конечно, полезно для верстальщика. Но вот с какой стороны подступиться?
После недели теории, я решила все же опробовать хоть что-то на практике. Вспомнилось сколько раз я мучилась, подгоняя под требования ТЗ всевозможные галереи, которых сейчас в интернете великое множество. Отсюда и родилась идея реализации галереи удобной для верстальщика, а главное простой!

Поэтому хочу показать свою, надеюсь простую и понятную.

Код html минимален и прост, как 5 копеек:

Вот этот небольшой список изображений, с одним единственным идентификатором, и есть будущая галерея.

К ней небольшое оформление (css3 использовала просто для красоты, необходимости в нем нет):


И собственно сама галерея. За основу создания взят массив и работа с ним:


Все основные настройки сосредоточены в css (что не может не радовать верстальщика). И навесить поверх можно все, что угодно. Хоть иконки картинок сделать, вместо булетов. Хоть модальное окно, в которое будет выводится изображение. Хоть описания изображений. Для ИЕ придется подгонять стили (впрочем они тут больше для примера), но галерея прекрасно сохраняет функционал и в ИЕ6 :)


Ссылка на немного доработанную галерею. Я добавила маленькие привью. Архив: webfile.ru/6299206

@темы: JavaScript, HTML, CSS

Комментарии
2013-01-02 в 11:40 

SlidingDragon
А выложить архив с собраным примером можешь?

2013-01-03 в 13:49 

Makha
Все в порядке... Во всяком случае, в конечном итоге все будет в полном порядке!
Могу. Выложила. Немного доработанный (добавила привью).

     

@web-программирование

главная