01.09.2018
Проверка применение скриптов
+ Сворачивание категорий
+ Регулировка размера шрифта в постах бегунком
+ 10 последних сообщений форума
Отредактировано u7bb (2018-09-02 01:48:31)
Изминение 1 Сворачивание категорий
Страница: 1
Сообщений 1 страница 7 из 7
Поделиться12018-09-01 20:32:59
- Зарегистрирован: 2018-08-30
- Сообщений: 23
- Уважение: [+0/-0]
- Позитив: [+1/-0]
Поделиться22018-09-01 22:36:24
- Зарегистрирован: 2018-08-29
- Сообщений: 12
- Уважение: [+1/-0]
- Позитив: [+0/-0]
- Пол: Мужской
Пробуем первое:
+ Сворачивание категорий из http://forum.mybb.ru/viewtopic.php?id=25686#p650884
Добавил к сворачиванию категорий красивый эфект, сохранение осталось, упростил настройку в html-верх
Вариант 1
Код:
<script type="text/javascript">
//cookies
function setcookie(a,b,c) {if(c){var d = new Date();d.setTime(d.getTime()+c);}if(a && b) document.cookie = a+'='+b+(c ? '; expires='+d.toUTCString() : '');else return false;}
function getcookie(a) {var b = new RegExp(a+'=([^;]){1,}');var c = b.exec(document.cookie);if(c) c = c[0].split('=');else return false;return c[1] ? c[1] : false;}
var aimg = {
open: '-',
close: '+'
}
function categorytoggle(el){
var cat = $(el).parents('div.category');
cat.children('div.container').toggle('slow');
el.innerHTML = el.innerHTML == aimg.open ? aimg.close : aimg.open;
var catc = getcookie(cat.attr('id'));
catc = catc == 'close' ? 'open' : 'close';
setcookie(cat.attr('id'),catc,3600*24*30*1000);
}
</script>
==
вместо выделенных + и - можно вставить любой другой символ или картинку
<img src="адрес" border="0" />
= в хтмл-низ ставить это
<script type="text/javascript">
$('#pun-main div.category > h2 div.catleft').after('<a href="#" onclick="categorytoggle(this); return false;" style="float: right;">'+aimg.open+'</a>');
for(var i=1;i<=$('#pun-main div.category').length;i++)
if(getcookie('pun-category'+i)=='close'){
$('#pun-category'+i+' > div.container').css({display: 'none'});
$('#pun-category'+i+' > h2 > a').html(aimg.close)
}
</script>==
вместо выделенных + и - можно вставить любой другой символ или картинку
<img src="адрес" border="0" />
= в хтмл-низ ставить это
<script type="text/javascript">
$('#pun-main div.category > h2 div.catleft').after('<a href="#" onclick="categorytoggle(this); return false;" style="float: right;">'+aimg.open+'</a>');
for(var i=1;i<=$('#pun-main div.category').length;i++)
if(getcookie('pun-category'+i)=='close'){
$('#pun-category'+i+' > div.container').css({display: 'none'});
$('#pun-category'+i+' > h2 > a').html(aimg.close)
}
</script>
==
если вместо плюса и минуса вставлять изображения, то желательно прописывать к ним всплывающую при наведении курсора подсказку
<img src="адрес" alt="Cкрыть раздел" border="0" />
<img src="адрес" alt="Показать раздел" border="0" />
Поделиться32018-09-01 22:46:55
- Зарегистрирован: 2018-08-30
- Сообщений: 23
- Уважение: [+0/-0]
- Позитив: [+1/-0]
A7bb написал(а):
Пробуем первое:
+ Сворачивание категорий из http://forum.mybb.ru/viewtopic.php?id=25686#p650884
всё отлично отработало. Посмотрю что будет если выберу другой стиль.
Поделиться42018-09-01 23:09:52
- Зарегистрирован: 2018-08-30
- Сообщений: 23
- Уважение: [+0/-0]
- Позитив: [+1/-0]
Попробовать изменить размер, цыет, чтоб было видно + и -
Поделиться52018-09-01 23:36:58
- Зарегистрирован: 2018-08-29
- Сообщений: 12
- Уважение: [+1/-0]
- Позитив: [+0/-0]
- Пол: Мужской
Вот тут есть по этому предложение: http://forum.mybb.ru/viewtopic.php?id=25686#p651062
Попрпавки
Добавить класс к ссылке в скрипте, идущим HTML низ
<script type="text/javascript">
$('#pun-main div.category > h2 div.catleft').after('<a href="#" class="offctgr" onclick="categorytoggle(this); return false;" style="float: right;">'+aimg.open+'</a>');
for(var i=1;i<=$('#pun-main div.category').length;i++)
if(getcookie('pun-category'+i)=='close'){
$('#pun-category'+i+' > div.container').css({display: 'none'});
$('#pun-category'+i+' > h2 > a').html(aimg.close)
}
</script>И поставить css код, задающий цвет в HTML верх
<style>
.offctgr {
color:#AAAA00!important;
font-weight:bold!important;
text-decoration:none!important;
font-size:23px!important;
margin-top:-3px;
}
</style>Красным : цвет; размер; смещение
Поделиться62018-09-02 01:32:04
- Зарегистрирован: 2018-08-29
- Сообщений: 12
- Уважение: [+1/-0]
- Позитив: [+0/-0]
- Пол: Мужской
Вроде получилось, будет так:
Вариант 3
=== 3 (Добавлен размер, цвет)
= Верх
<style>
.offctgr {
color:#FFD700!important;
font-weight:bold!important;
text-decoration:none!important;
font-size:13px!important;
margin-top:-3px;
}
</style>
<script type="text/javascript"><!--Сворачивание категорией Ч1-->
//cookies
function setcookie(a,b,c) {if(c){var d = new Date();d.setTime(d.getTime()+c);}if(a && b) document.cookie = a+'='+b+(c ? '; expires='+d.toUTCString() : '');else return false;}
function getcookie(a) {var b = new RegExp(a+'=([^;]){1,}');var c = b.exec(document.cookie);if(c) c = c[0].split('=');else return false;return c[1] ? c[1] : false;}var aimg = {
open: '-Свернуть-',
close: '+Развернуть+'
}
function categorytoggle(el){
var cat = $(el).parents('div.category');
cat.children('div.container').toggle('slow');
el.innerHTML = el.innerHTML == aimg.open ? aimg.close : aimg.open;
var catc = getcookie(cat.attr('id'));
catc = catc == 'close' ? 'open' : 'close';
setcookie(cat.attr('id'),catc,3600*24*30*1000);
}
</script>= Низ
<script type="text/javascript"><!--Сворачивание категорией Ч2-->
$('#pun-main div.category > h2 div.catleft').after('<a href="#" class="offctgr" onclick="categorytoggle(this); return false;" style="float: right;">'+aimg.open+'</a>');
for(var i=1;i<=$('#pun-main div.category').length;i++)
if(getcookie('pun-category'+i)=='close'){
$('#pun-category'+i+' > div.container').css({display: 'none'});
$('#pun-category'+i+' > h2 > a').html(aimg.close)
}
</script>
Поделиться72018-09-02 01:47:02
- Зарегистрирован: 2018-08-30
- Сообщений: 23
- Уважение: [+0/-0]
- Позитив: [+1/-0]
Пойдёт.
Теперь можно переходить к + Регулировка размера шрифта в постах бегунком
Страница: 1