LightGallery это скрипт для просмотра изображений, написанный на JavaScript (подобен популярному скрипту LightBox). Он способен отображать как одиночные изображения, так и галереи с использованием визуальных эффектов. Скрипт очень компактен (7K – сжатая версия) и полнофункциональный, и при этом он независит от других библиотек.
В этот бета релиз я включил достаточно много полезных функций, одна из самых важных это возможность указывать опции при инициализации галереи. Теперь можно указывать, нужно ли использовать анимацию, показывать ли значки изменения изображений и др. Полный список опций:
- animate (по умолчанию – true) – включить/выключить анимацию
- framesNumber (по умолчанию – 20) – количество кадров используемых при анимации
- speed (по умолчанию – 30) – промежуток времени между кадрами, мсек
- resizeSync (по умолчанию – false) – если установлено в true, то контейнер изменяет размеры одновременно и по ширине и по высоте
- enableZoom (по умолчанию – true) – включить/выключить изменение масштаба картинки
- fadeImage (по умолчанию – true) – использовать эффект плавного появления изображения (лучше выключить для изображений большого размера)
- alias (по умолчанию – ‘lightgallery’) – псевдоним для атрибута rel (rel = ‘lightgallery’).
Изменился и метод подключения скрипта. Если раньше достаточно было просто подключить основной скрипт, то сейчас необходимо добавить явный вызов функции lightgallery.init(), которая может принимать один параметр – объект, содержащий опции. Пример:
<script src="lightgallery/lightgallery.min.js" type="text/javascript"></script>
<script type="text/javascript">
window.onload = function(){
lightgallery.init({
enableZoom:false,
speed:50,
fadeImage:false
});
}
</script>
В новую версию также добавлены файлы русификации для трех кодировок – utf-8, cp-1251, koi8-r. Чтобы русифицировать скрипт, нужно просто подключить нужный файл русификации из папки lang. Это нужно обязательно сделать сразу после подключения основного скрипта. Пример:
<script src="lightgallery/lightgallery.min.js" type="text/javascript"></script>
<script src="lightgallery/lang/ru_utf8.js" type="text/javascript"></script>
В предыдущей версии анимированное изменение размеров контейнера производилось одновременно и по ширине и по высоте, в новой версии по умолчанию размер контейнера изменяется последовательно. Если же вам по душе вариант с одновременным изменением размера, то установите опцию resizeSync в true. Также полезным может быть возможность установки псевдонима для атрибута rel. В предыдущей версии в ссылки, которые нужно было отображать, добавлялся атрибут rel=”lightgallery”. Теперь, вместо lightgallery можно использовать другое значение при помощи опции alias. Например, если установить псевдоним в значение lightbox, то ссылки можно отметить как rel=”lightbox”, таким образом можно легко перейти с LightBox на LightGallery не изменяя все ссылки.
Ну и последнее – в этой версии добавлена возможность управления при помощи клавиатуры: n – следующее изображение, b – предыдущее изображение, + / - – увеличить/уменьшить изображение, f – показывает истинный размер изображения, ESC – закрыть галерею.
На этом все. Если у вас появятся замечания, буду рад услышать.
смотреть демоскачать
Скачать LightGallery также можно на Google Code. Страница проекта находится здесь.
