Highslide JS - это мощный js-скрипт для создания галерей, просмотра любого html контента в красивых окнах с эффектами, навигацией и кучей настроек.
Мало кто использует highslide.js на uCoz, а ведь это - отличная замена стандартным окошкам.
Здесь можно ознакомиться с возможностями и подстроить скрипт под себя
Скачать архив с файлами
подключите как обыкновенный скрипт в <head></head>
Код
<link rel="stylesheet" type="text/css" href="http://dedicated.3dn.ru.ru/uCoz/highslide/highslide.css" />
<script type="text/javascript" src="http://dedicated.3dn.ru/uCoz/highslide/highslide-full.js"></script>
<script type="text/javascript" src="/highslide/highslide.config.js" charset="utf-8"></script>
<script type="text/javascript">hs.graphicsDir = '/highslide/graphics/';</script>
Примеры использования
Открытие списка пользователей
Код cсылки:
Код
<a href="/index/15-1" title="Список пользователей" onclick="return hs.htmlExpand(this, { objectType: 'iframe',width: 618, headingText: 'User list', wrapperClassName: 'titlebar' } )">Список пользователей</a>
Редактирование личной информации
Код cсылки:
Код
<a href="/index/11" onclick="return hs.htmlExpand(this, { objectType: 'iframe',width: 600,height: 400, headingText: 'Редактирование', wrapperClassName: 'titlebar' } )">Редактировать личную информацию</a>
Личные сообщения
Код cсылки:
Код
<a href="$PM_URL$" onclick="return hs.htmlExpand(this, { objectType: 'iframe',width: 600,height: 400, headingText: 'Ваши личные сообщения', wrapperClassName: 'titlebar' } )">Личные сообщения</a>
Персональные страницы
В ПУ настроить "Главная » Пользователи » Настройки модуля » Персональную страницу пользователя открывать » В новом окне (простом)"
Скрипт перед </body>:
Код
<script type="text/javascript">$(document).ready(function(){
//!User Profile
$('a[href*="/index/8"]').click(function(){
return hs.htmlExpand(this, { objectType: 'iframe',width:618, headingText: 'Персональная страницы', wrapperClassName: 'titlebar' } );
return false;
});
});</script>
Теперь все ссылки на страницы пользователей должны открываться в окошках highslide
Банальное слайдшоу
Примерно таким образом можно открывать миниатюры картинок в новостях\файлах\прочих модулях через highslide:
Код
<?if($IMG_URL1$)?><a href="$IMG_URL1$" class="highslide" title="" onclick="return hs.expand(this, config1 )"><img src="$IMG_SMALL_URL1$" alt="" border="0" /></a><br><br><?else?><?endif?>
<?if($IMG_URL2$)?>
<a href="$IMG_URL2$" class="highslide" title="" onclick="return hs.expand(this, config1 )"><img src="$IMG_SMALL_URL2$" alt="" border="0" /></a> <br><br><?else?><?endif?>
<?if($IMG_URL3$)?><a href="$IMG_URL3$" class="highslide" title="" onclick="return hs.expand(this, config1 )"><img src="$IMG_SMALL_URL3$" alt="" border="0" /></a><br><br><?else?><?endif?>
<?if($IMG_URL4$)?><a href="$IMG_URL4$" class="highslide" title="" onclick="return hs.expand(this, config1 )"><img src="$IMG_SMALL_URL4$" alt="" border="0" /></a><br><br><?else?><?endif?>
<?if($IMG_URL5$)?><a href="$IMG_URL5$" class="highslide" title="" onclick="return hs.expand(this, config1 )"><img src="$IMG_SMALL_URL5$" alt="" border="0" /></a><br><br><?else?><?endif?>
<?if($IMG_URL6$)?><a href="$IMG_URL6$" class="highslide" title="" onclick="return hs.expand(this, config1 )"><img src="$IMG_SMALL_URL6$" alt="" border="0" /></a><br><br><?else?><?endif?>
<?if($IMG_URL7$)?><a href="$IMG_URL7$" class="highslide" title="" onclick="return hs.expand(this, config1 )"><img src="$IMG_SMALL_URL7$" alt="" border="0" /></a><br><br><?else?><?endif?>
<?if($IMG_URL8$)?><a href="$IMG_URL8$" class="highslide" title="" onclick="return hs.expand(this, config1 )"><img src="$IMG_SMALL_URL8$" alt="" border="0" /></a><br><br><?else?><?endif?>
<?if($IMG_URL9$)?><a href="$IMG_URL9$" class="highslide" title="" onclick="return hs.expand(this, config1 )"><img src="$IMG_SMALL_URL9$" alt="" border="0" /></a><br><br><?else?><?endif?>
<?if($IMG_URL10$)?><a href="$IMG_URL10$" class="highslide" title="" onclick="return hs.expand(this, config1 )"><img src="$IMG_SMALL_URL10$" alt="" border="0" /></a><br><br><?else?><?endif?>
...
