Заработок в интернете и раскрутка вашего сайта Суббота, 16.12.2017, 19:56
[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
Страница 1 из 11
Форум » Создание сайта » HTML коды для uCoz » Фотогалерея для uCoz с плавным увеличением фото (lightbox) (Фотогалерея для uCoz с плавным увеличением фото (lightbox))
Фотогалерея для uCoz с плавным увеличением фото (lightbox)
adminДата: Суббота, 21.12.2013, 15:37 | Сообщение # 1
Главный админ
Группа: Администраторы
Сообщений: 336
Награды: 0
Репутация: 1
Статус: Offline
Фотогалерея для uCoz с плавным увеличением фото (lightbox)

Просто великолепный материал совсем недавно адаптировал для сайтов uCoz. Это красивая фотогалерея, на которой фотографии плавно увеличиваются при просмотре, а так же есть затемнение, а даже скорее просветление картинок, когда вы наводите на них мышкой. Отличный материал, будет полезен многим. Например, при хорошем знание html эту галерею можно оптимизировать по существующий фотоальбом на вашем uCoz сайте, или же можно использовать её просто, в таком виде как она тут выложена. Не забудьте, в коде фотогалереи прописать пути до картинок, иначе ничего работать не будет. Есть вопросы? Пишите комментарии и мы постараемся вам написать ответ и помочь.

В данном материале нету ни одного скрипта, что облегчает работу сайта. Всё сделано на Css3 и HTML.

Установка фотогалереи на сайт uCoz:

В самый низ вашего css вставляйте: код найдёте в прикреплённом архиве.

Следующий код в то место, где будет галерея:

Код
<section>
<ulclass="lb-album">
<li>
<ahref="#image-1">
<imgsrc="Ссылка на миниатюру"alt="image01">
<span>Заголовок на миниатюре</span>
</a>
<divclass="lb-overlay"id="image-1">
<ahref="#page"class="lb-close">x Close</a>
<imgsrc="Ссылка на большую картинку"alt="image01"/>
<div>
<h3>Заголовок</h3>
<p>Описание</p>
</div>
</div>
</li>

<li>
<ahref="#image-2">
<imgsrc="Ссылка на миниатюру 2"alt="image02">
<span>Заголовок на миниатюре 2</span>
</a>
<divclass="lb-overlay"id="image-2">
<ahref="#page"class="lb-close">x Close</a>
<imgsrc="Ссылка на большую картинку 2"alt="image02"/>
<div>
<h3>Заголовок 2</h3>
<p>Описание 2</p>
</div>
</div>
</li>
</ul>
</section>



data-yashareType="button" data-

yashareQuickServices="yaru,vkontakte,facebook,twitter,odnoklassniki,moimir,lj,gplus">



data-mrc-config="{'cm' : '1', 'sz' : '20', 'st' : '1', 'tp' : 'mm'}">Нравится

 

Нравится







Форум » Создание сайта » HTML коды для uCoz » Фотогалерея для uCoz с плавным увеличением фото (lightbox) (Фотогалерея для uCoz с плавным увеличением фото (lightbox))
Страница 1 из 11
Поиск:

Заработок в интернете и продвижение вашего сайта © 2013-2017
Копирование материалов сайта без согласия запрещено!

Яндекс.Метрика

СЕГОДНЯ НАС ПОСЕТИЛИ:

200