Фотоальбом в виде выдвигающихся фото на highslide
Приятный на глаз скрипт , мне понравился.
Установка:
Заливаем в корень сайта папку highslide из архива
На всех страницах фотоальбома подключаем скрипты в head (между <head> и </head>)
Code
<script type="text/javascript" src="/highslide/highslide-with-gallery.js"></script>
<link rel="stylesheet" type="text/css" href="/highslide/highslide.css" />
Далее туда же подключаем графическиен элементы
Code
<script type="text/javascript">
hs.graphicsDir = '/highslide/graphics/';
hs.align = 'center';
hs.transitions = ['expand', 'crossfade'];
hs.outlineType = 'rounded-white';
hs.fadeInOut = true;
//hs.dimmingOpacity = 0.75;
// Add the controlbar
hs.addSlideshow({
//slideshowGroup: 'group1',
interval: 5000,
repeat: false,
useControls: true,
fixedControls: 'fit',
overlayOptions: {
opacity: .75,
position: 'bottom center',
hideOnMouseOut: true
}
});
</script>code>
Что бы убрать логотип powered_by (пункт не обязателен к выполнению и может повлеч бан вашего сайта от UCoZ'a) нужно добавить строчку
[/code]
hs.showCredits = false;
Code
Ну и последнее, в виде фотографий меняем
[code]
<a href="$PHOTO_LIGHTBOX_URL$" title="Просмотры: $REVIEWS$ ¦ Размеры: $PHOTO_SIZE$, $PHOTO_WEIGHT$Kb">$PHOTO$</a>code>
На
Code
<a id="thumb$ID$" href="$FULL_PHOTO_DIRECT_URL$"
class="highslide" onclick="return hs.expand(this)">
<img src="$PHOTO_DIRECT_URL$" border="0"
title="$PHOTO_DESCR$" /></a>
P.S. Не забываем скачивать архив.
Источник: не указан
0 комментариев