Название форума
Название темы
Ответов
Последний от
» Зарег. на сайте
Всего: 1483
Новых за месяц: 2
Новых за неделю: 0 >Новых вчера: 0
Новых сегодня: 0
» Из них
Администраторов: 2
Модераторов: 1
Киноманы: 14
Проверенных: 2
Обычных юзеров: 1443
» Из них
Парней: 978
Девушек: 505

Безропотные / The Qu...
Категоря: Фильмы 2024 - 2025 г.




Просмотров: 2
Размер: 4,46 ГБ
От: bard
Скачан 2 раз(а)

Иерархия / Hierarchy...
Категоря: Фильмы 2024 - 2025 г.




Просмотров: 1
Размер: 4,81 ГБ
От: bard
Скачан 1 раз(а)

Признание / Kokuhaku...
Категоря: Фильмы 2024 - 2025 г.




Просмотров: 3
Размер: 1,08 ГБ
От: bard
Скачан 3 раз(а)

Голый пистолет / The...
Категоря: Фильмы 2024 - 2025 г.




Просмотров: 1
Размер: 4,27 ГБ
От: bard
Скачан 1 раз(а)

Nat Geo Wild: Охотни...
Категоря: Документальные фильмы




Просмотров: 1
Размер: 1.21 GB
От: bard
Скачан 1 раз(а)
  • Страница 1 из 1
  • 1
Модератор форума: Mytorrento  
Простая галерея скриншотов для сайта
MytorrentoДата: Воскресенье, 05-Май-19, 16:08 | Сообщение # 1
Уверенный пользователь
Группа: Администраторы
Сообщений: 49
Награды: 4
Репутация: 41
Статус: Вне форума

Доброго времени суток уважаемые пользователи и гости!

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

1 .В редакторе страниц сайта между тегами head подключаем скрипт библиотеки.
Код
<script type="text/javascript" src="/highslide/highslide-with-gallery.js"></script>


сразу после добавляем

Код
<script type="text/javascript">  
hs.addSlideshow({  
// slideshowGroup: 'group1',  
interval: 3000,  
repeat: false,  
useControls: true,  
fixedControls: true,  
overlayOptions: {  
opacity: .6,  
position: 'bottom center',  
hideOnMouseOut: true  
},  
thumbstrip: {  
position: 'top center',  
mode: "horizontal"  

}  
});  

// Optional: a crossfade transition looks good with the slideshow  

hs.wrapperclassname = 'borderless';  
hs.outlinetype = 'rounded-white';  
hs.graphicsDir = '/highslide/graphics/';  
hs.align = 'center';  
hs.transitions = ['expand', 'crossfade'];  
hs.outlineType = 'glossy-dark';  
hs.wrapperClassName = 'dark';  
hs.fadeInOut = true;  
hs.dimmingOpacity = 0.90;  
hs.numberPosition = 'caption';  
</script>

Далее нужно подключить стили
Код
<link rel="stylesheet" type="text/css" href="/highslide/highslide.css" />


Установка завершена.

2. Теперь будем выводить галерею на страницу материала и комментариев.
HTML такого типа ставим в то место где хотите видеть галерею
Код
<a href="http://ваша картинка" class="highslide" onclick="return hs.expand(this,{align: 'center'})"><img src="http://ваша картинка" width="220" height="120"/></a>


PS: Размер миниатюры скриншота - width="220" height="120" здесь меняем как угодно вам.
Прикрепления: 490_highslide.rar (99.9 Kb)



подпишись не пропусти новинки
 
  • Страница 1 из 1
  • 1
Поиск: