|
|
|
| Таблицы стилей. Галерея изображений |
| Технология CSS дает новую возможность работы с изображениями (image). |
| Лучше начинать с одного изображения, например, так, |
| или так, |
| или так, |
| Интересным вариантом работы с изображениями является создание галерей, когда посетитель сайта может просмотреть |
| несколько кадров без вертикальной или горизонтальной прокрутки. |
| При попытке ознакомится с практическими реализациями этого направления через поисковый сервер в интернете |
| (например, Google), выдается обширный список, который можно оценить известным выражением «дерьмо всегда всплывает…». |
| Как правило, находящиеся в верхней части списка «решения» либо не поддерживаются каким-нибудь браузером, либо |
| демонстрирует решение за финансовое вознаграждение, либо пересылает обращение на другой сайт. |
| Поэтому придется поработать, чтобы найти приемлемое, а точнее, понятное решение. |
| Одним из интересных вариантов галереи является решение на сайте |
| http://www.creativejuiz.fr/trytotry/juizy-slideshow-full-css3-html5/ |
| Решение интересно тем, что поддерживается текущей линейкой браузеров, объясняет суть подхода и реально |
| демонстрирует приемлемое слияние направлений разработки интернет-инструментов от различных компаний. |
| С точки зрения функциональности, решение скорее является работающей демонстрацией элементов управления, |
| построенных с помощью CSS. И для самоконтроля собственного уровня понимания этой технологии, является отличным |
| полигоном. |
| Вашему вниманию предлагается приемлемый вариант модификация, в котором тестируется удаление избыточных элементов |
| управления, увеличение количества кадров и управление изменением внешнего оформления. |
| Тестирование галереи проводилось на операционной системе Windows 7.pro (64 бит). Использовались текущие браузеры: |
|
| Резюме |
| Использование этого направления требует значительных усилий для получения приемлевого решения: |
| - применение процентных величин, ограничивает количество кадров. Это число обязательно должно быть кратным 100 (1, |
| 2, 4, 5, 10, …). Но, уже при количестве кадров более 5 становится критичной возможность их транспортировки между |
| сервером и клиентом; |
| - изменение внешнего вида одного элемента рассредоточено по многим местам CSS строк, и для модификации требуется |
| хороший уровень комментариев; |
| - даже для просчета простых арифметических зависимостей лучше применять электронные таблицы (например, Excel) и, с |
| увеличением кадров, количество этих расчетов возрастает; |
| - имена файлов-картинок рассредоточены, размерозависимы (изменение размера требует перерасчета в нескольких местах |
| CSS документа); |
| - количество экранов галереи на странице лучше ограничить одним. |
| - для использования собственного фотоаппарата, придется изменять размеры экрана. Изменения пройдут значительно |
| легче, если ширину оставить без изменений, а модифицировать только высоту экрана. |
| Так что для принятия решения по применению подобных технологий предварительно оцените свои возможности. |
