Скрипт добавляет на главную страницу справа или слева небольшое навигационное меню, которое позволяет быстро переходить от категории к категории.
Ставим в хтмл-верх/хтмл-низ
<script type="text/javascript" src="https://forumstatic.ru/files/0011/e9/e1/32423.js"></script>
<script type="text/javascript">
//перечисляем ВСЕ категории: "название":"ссылка на изображение"
//в порядке их расположения
var catmenu = {
"Работа сервиса и форума":"http://www.iconsearch.ru/uploads/icons/alien/32x32/home.png",
"Технический раздел":"http://www.iconsearch.ru/uploads/icons/oxygen/32x32/preferences-system.png",
"Форумы Quadro.Boards":"http://www.iconsearch.ru/uploads/icons/nuvola2/32x32/edu_languages.png",
"Прочее":"http://www.iconsearch.ru/uploads/icons/webapp/32x32/comment.png",
"Архив":"http://www.iconsearch.ru/uploads/icons/nuove/32x32/package.png" //после последней запятая ненужна
};
function scrMenuMake(catlist,catarr) {
var menuhtml = '';
$('#pun-announcement').prepend('<div id="pagenav" class="pageScroller"><ul></ul></div>');
$(catarr).each(function(){menuhtml+= '<li><a href="#"><img src="'+catmenu[$(this).find('span').html()]+'"></a></li>';})
$('#pagenav ul').append(menuhtml);
}
jQuery(document).ready(function(){
var cats = $('.category');
if(cats.length>0) {
scrMenuMake(catmenu, cats);
jQuery('#pun-index').pageScroller({
navigation: '#pagenav',
sectionClass: 'category'
});}
});
</script>
Сюда добавляем ВСЕ (включая скрытые) категории на форуме.
var catmenu = {
"Работа сервиса и форума":"http://www.iconsearch.ru/uploads/icons/alien/32x32/home.png",
"Технический раздел":"http://www.iconsearch.ru/uploads/icons/oxygen/32x32/preferences-system.png",
"Форумы Quadro.Boards":"http://www.iconsearch.ru/uploads/icons/nuvola2/32x32/edu_languages.png",
"Прочее":"http://www.iconsearch.ru/uploads/icons/webapp/32x32/comment.png",
"Архив":"http://www.iconsearch.ru/uploads/icons/nuove/32x32/package.png" //после последней запятая ненужна
};
Для каждой группы пользователей отобразятся только те, которые они видят. По схеме:
"точное_название_категории":"ссылка_на_иконку"
Стили (в хтмл-верх или свой стиль)
<style>
#pagenav {
right: -110px;
margin: -180px 0px 0px;
overflow: visible;
padding: 5px;
position: fixed ! important;
top: 50%;
width: 150px;
z-index: 0;
}
#pagenav ul {
background: none repeat scroll 0% 0% #f0f0f0;
border-radius: 15px 15px 15px 15px;
box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.5);;
display: block;
list-style: none outside none;
margin: 0px;
padding: 6px 0px;
}
#pagenav li {
display: block;
}
#pagenav li a {
display: block;
padding: 8px 10px;
text-align: left;
}
#pagenav li.active a {
background-color: #a0a0a0;
box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.5);
}
</style>
<style>
#pagenav {
rigth: -110px;
margin: -180px 0px 0px;
overflow: visible;
padding: 5px;
position: fixed ! important;
top: 50%;
width: 150px;
z-index: 0;
}
#pagenav ul {
background: none repeat scroll 0% 0% #f0f0f0;
border-radius: 15px 15px 15px 15px;
box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.5);;
display: block;
list-style: none outside none;
margin: 0px;
padding: 6px 0px;
}
#pagenav li {
display: block;
}
#pagenav li a {
display: block;
padding: 8px 10px;
text-align: right;
}
#pagenav li.active a {
background-color: #a0a0a0;
box-shadow: 1px 2px 5px 0px rgba(0, 0, 0, 0.5);
}
</style>
