Реализация вывода категорий форума через вкладки, при помощи jQuery, для стиля prosilver и его клонов.
Вывод категорий через вкладки позволяет сэкономить место на странице "Список форумов" и нажав на соответствующую вкладку, без перезагрузки страницы, увидеть её содержание.
Открываем
Внимание!
Если у вас уже есть:
то тогда его ставить не нужно.
Если у вас:
то добавьте к нему
Далее находим:
Меняем на:
В самый конец шаблона ставим:
Внимание!
Если у вас уже был в шаблоне:
То закрывающий
Далее добавляем css, открываем тему вашего стиля и в самый конец добавляем:
Внимание!
В IE8 не будет закруглённых углов на вкладках, так как он не поддерживает CSS3.
В IE6 вкладки будут работать не так как должны.
Вывод категорий через вкладки позволяет сэкономить место на странице "Список форумов" и нажав на соответствующую вкладку, без перезагрузки страницы, увидеть её содержание.
Открываем
forumlist_body.html
в самое начало ставим:
Код: Выделить всё
<!-- IF SCRIPT_NAME eq 'index' -->
<div id="tab">
<ul>
<!-- BEGIN forumrow --><!-- IF forumrow.S_IS_CAT --><li><a href="#" name="#tab{forumrow.FORUM_ID}"><span>{forumrow.FORUM_NAME}</span></a></li><!-- ENDIF --><!-- END forumrow -->
</ul>
</div>
<!-- ENDIF -->
<div id="forumlist">
Внимание!
Если у вас уже есть:
Код: Выделить всё
<div id="forumlist">
Если у вас:
Код: Выделить всё
<div class="forumlist">
id="forumlist"
:
Код: Выделить всё
<div id="forumlist" class="forumlist">
Код: Выделить всё
<div class="forabg">
Код: Выделить всё
<div class="forabg" id="tab{forumrow.FORUM_ID}">
Код: Выделить всё
</div>
<!-- IF SCRIPT_NAME eq 'index' -->
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
function resetTabs(){
$("#forumlist div.forabg").hide();
$("#tab a").attr("id","");
}
var myUrl = window.location.href;
var myUrlTab = myUrl.substring(myUrl.indexOf("#"));
var myUrlTabName = myUrlTab.substring(0,4);
(function(){
$("#forumlist div.forabg").hide();
$("#tab li:first a").attr("id","activetab");
$("#forumlist div.forabg:first").fadeIn();
$("#tab a").on("click",function(e) {
e.preventDefault();
if ($(this).attr("id") == "activetab"){
return
}
else{
resetTabs();
$(this).attr("id","activetab");
$($(this).attr('name')).fadeIn();
}
});
for (i = 1; i <= $("#tab li").length; i++) {
if (myUrlTab == myUrlTabName + i) {
resetTabs();
$("a[name='"+myUrlTab+"']").attr("id","activetab");
$(myUrlTab).fadeIn();
}
}
})()
</script>
<!-- ENDIF -->
Если у вас уже был в шаблоне:
Код: Выделить всё
<div class="forumlist">
</div>
ставить не нужно, ставьте:
Код: Выделить всё
<!-- IF SCRIPT_NAME eq 'index' -->
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
function resetTabs(){
$("#forumlist div.forabg").hide();
$("#tab a").attr("id","");
}
var myUrl = window.location.href;
var myUrlTab = myUrl.substring(myUrl.indexOf("#"));
var myUrlTabName = myUrlTab.substring(0,4);
(function(){
$("#forumlist div.forabg").hide();
$("#tab li:first a").attr("id","activetab");
$("#forumlist div.forabg:first").fadeIn();
$("#tab a").on("click",function(e) {
e.preventDefault();
if ($(this).attr("id") == "activetab"){
return
}
else{
resetTabs();
$(this).attr("id","activetab");
$($(this).attr('name')).fadeIn();
}
});
for (i = 1; i <= $("#tab li").length; i++) {
if (myUrlTab == myUrlTabName + i) {
resetTabs();
$("a[name='"+myUrlTab+"']").attr("id","activetab");
$(myUrlTab).fadeIn();
}
}
})()
</script>
<!-- ENDIF -->
Код: Выделить всё
/* Category Tabs */
#tab {
line-height: normal;
margin: 0 0 -1px 7px;
min-width: 600px;
height: 1%;
overflow: hidden;
border-bottom: 1px solid #DCDEE2;
}
#tab ul {
margin:0;
padding: 0;
list-style: none;
}
#tab li {
display: inline;
margin: 0;
padding: 0;
font-size: 0.85em;
font-weight: bold;
}
#tab a {
float: left;
background: url("{T_THEME_PATH}/images/bg_list.gif") repeat 0 100% #0076B1;
margin: 0 1px 0 0;
padding: 0 0 0 7px;
text-decoration: none;
position: relative;
border-radius: 5px 5px 0 0;
-webkit-border-radius: 5px 5px 0 0;
-moz-border-radius: 5px 5px 0 0;
}
#tab a span {
float: left;
display: block;
background: url("{T_THEME_PATH}/images/bg_list.gif") repeat 0 100% #0076B1;
padding: 7px 10px 4px 4px;
color: #ccc;
white-space: nowrap;
font-family: Arial, Helvetica, sans-serif;
text-transform: uppercase;
font-weight: bold;
font-size: 10px;
border-radius: 0 5px 0 0;
-webkit-border-radius: 0 5px 0 0;
-moz-border-radius: 0 5px 0 0;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tab a span { float:none;}
/* End hack */
#tab a:hover {
background-position: 0% 20%;
}
#tab a:hover span {
color: #fff;
background-position: 0% 20%;
}
#tab #activetab {
background-position: 0 0%;
border-bottom: 0;
}
#tab #activetab span {
background-position: 0% 0%;
padding-bottom: 5px;
color: #fafafa;
}
Внимание!
В IE8 не будет закруглённых углов на вкладках, так как он не поддерживает CSS3.
В IE6 вкладки будут работать не так как должны.
Комментарии: 10
- Галина
- Сообщения: 23
- Зарегистрирован: 28 фев 2013, 09:50
- Пол: Жен
Спасибо за скриптик! Очень удобно!
- Галина
- Сообщения: 23
- Зарегистрирован: 28 фев 2013, 09:50
- Пол: Жен
Сейчас только увидела, что дна категория не видна. Почему это может быть? Может ли это быть связано с тем, что там нет подфорумов и тем?
- Галина
- Сообщения: 23
- Зарегистрирован: 28 фев 2013, 09:50
- Пол: Жен
а как же я её создам? категории-то вообще в меню нет!CabinetAdmin писал(а):Галина
Создайте одну тему, тестовую, посмотрите.
Создала тему в другом форуме, потом хотела переместить, Но... ссылка на данную категорию НЕ АКТИВНА.
Что не так?
Я ничего не понимаю! Может быть там только определённое кол-во категорий допустимо?
- Галина
- Сообщения: 23
- Зарегистрирован: 28 фев 2013, 09:50
- Пол: Жен
Права доступа все сделала. Форум. А для чего форум? Разве нельзя писать только в категории? Открывать новые темы и всё. Вернее, я хотела открыть его как Архив тем.CabinetAdmin писал(а):Хорошо, категория есть, а форум в нём? Права доступа?
Точно. Создала форум, категория появилась.
- Галина
- Сообщения: 23
- Зарегистрирован: 28 фев 2013, 09:50
- Пол: Жен
Если б я всё это знала!CabinetAdmin писал(а):Категория, это категория, она объединят в себя форумы. А вот в форумах как раз и создаются темы и сообщения.
Похожие темы
-
Расширение позволяющее добавить рекламу на форум phpBB.
Расширение можно скачать на официальном сайте phpbb -
Расширение с правками от...