Украсить свой сайт или компактно вывести медиа информацию разработчик может галереями или слайдерами. Представляю вашему вниманию интересную jQuery галерею собственного производства, которую вы легко можете установить на вашем сайте.
Данная галерея слева показывает картинку в увеличенном варианте, а справа в виде миниатюр, нажав на которые они перемещаются в левую сторону. Данная галерея использует jQuery синтаксис, следовательно для ее работы вам понадобится библиотека jQuery.
Чтобы классы стилей и даже скриптов по максимому не конфликтовали с уже установленными скриптами на вашем сайте, я сделал их достаточно уникальными.
Сразу хочу отметить особенности галереи:
1. У нее нет автопрокрутки, она рассчитана на то, что если пользователь заинтересуется информацией, он сам будет листать фото с помощью кнопок стрелок или кликая на миниатюры.
2. Можно устанавливать бесконечно много таких галерей. Функции настроены так, что id галереям не нужны.
3. Если картинок много (миниатюр), то они прячутся в блоке с полосой прокрутки.
4. Минимальный размер css и jQuery кода за счет чего галерея совсем не нагружает сайт.
5. Так как css код очень небольшой вы можете изменить отображение галереи как угодно.
Если вам необходимо, чтобы заглавная каптинка галереи была ссылкой, то измените код вывода картинки так: <div class="praon28"><a href="https://blogprogram.ru/"><img src="images/loader.gif"/></a></div>.
Если вам нужно, чтобы нажав на миниатюру, пользователь перешел на другую страницу или просто задать каждой миниатюре свою ссылку, то изменяйте код каждой картинки, например так: <div class="praon30"><a href="https://blogprogram.ru/"><img src="images/theme-8-1.jpg" /></a></div>. Естественно, при этом если пользователь кликнет на миниатюру, он сразу перейдет по ссылке на другой сайт, но стрелки, перелистывающие фото все-равно будут работать.
Думаю, для различных лэндингов или просто информативных сайтов эта галерея пригодится. Желаю успешной установки.
Добавить комментарий