Иконка рядом с названием категории

<script type="text/javascript"> 
var d = new Array()
d[0] = new Array("Test", "<img src='http://s002.radikal.ru/i199/1008/cb/55e7d492c2ed.png' alt='Идея' />")
d[1] = new Array("Тестовая категория", "<img src='http://s55.radikal.ru/i148/1008/f5/d8fef2cf62d5.png' alt='Windows Vista' />")

if (location.href == 'http://' + location.hostname + '/') {
var div = document.getElementById("pun-main").getElementsByTagName("div");
for (j in d) {
for (i in div) {
if ((div[i].className == "category") && (div[i].childNodes[0].innerHTML.indexOf(d[j][0]) != -1))
div[i].childNodes[0].innerHTML = "<span>" + d[j][1] + "&nbsp;&nbsp;" + d[j][0] + "</span>";
}}}
</script>

Названия категорий и изображения впишите свои. При необходимости увеличивайте число элементов в массиве.

+1

Поделиться7Вс, 5 Сен 2010 13:25:28

Автор: Romych
drumman
Зарегистрирован: Вт, 16 Дек 2008
Сообщений: 2708
Уважение: +4085
Позитив: +2378
Пол: Мужской
Последний визит:
Пн, 18 Ноя 2024 23:40:35

Своя иконка для каждой категории (аналог IPB © Romych)

идея предельно проста
не надо в скрипт вводить название категорий, достаточно указать порядковый номер категории и вставить соответствующее ей изображение

скрипт сделан с использование скриптовой библиотеки jquery,
которая к моей радости теперь официально поддерживается сервисом mybb

в html-низ
ставим

<script type="text/javascript">
$(document).ready(function(){
$('div#pun-category1.category > h2 > div.catleft ').after('<img src="http://icons.iconarchive.com/icons/icons-land/points-of-interest/32/Theater-Yellow-2-icon.png" style="margin-top:-7px;margin-left:-5px;margin-right:15px;margin-bottom:-9px"/>');
$('div#pun-category2.category > h2 > div.catleft').after('<img src="http://icons.iconarchive.com/icons/rokey/hardware/32/harddisc-icon.png" style="margin-top:-7px;margin-left:-5px;margin-right:15px;margin-bottom:-9px"/>');
$('div#pun-category3.category > h2 > div.catleft').after('<img src="http://icons.iconarchive.com/icons/deleket/gloss-adobe/32/Adobe-Flash-Player-icon.png" style="margin-top:-7px;margin-left:-5px;margin-right:15px;margin-bottom:-9px"/>');
});
</script>

в примере 3 категории,
если нужно больше, просто дублируете эту строку столько сколько у вас категорий

$('div#pun-category4.category > h2 > div.catleft').after('<img src="адрес изображения" style="margin-top:-7px;margin-left:-5px;margin-right:15px;margin-bottom:-9px"/>');

данный пример заточен под иконки размером 36х36, если будете использовать большего размера, то скорее всего придётся погонять отступы

смотрим ПРИМЕР 1 и ПРИМЕР 2

тестировал в Mozilla, Opera, Google Chrome

Отредактировано Romych (Ср, 15 Сен 2010 00:22:17)

+3

Instagram drumman.1

Поделиться8Вс, 5 Сен 2010 16:23:39

Автор: rps
Стремясь к новому...
Зарегистрирован: Вс, 12 Окт 2008
Сообщений: 22652
Уважение: +4738
Позитив: +3431
Пол: Мужской
Предупреждения: ‡ 1. 2. 3. ... 10!
Последний визит:
Вс, 14 Мар 2021 21:42:57

Romych
Я бы тебе хотел сделать одно замечание.

Romych написал(а):
$('div#pun-category4.category > h2 > div.catleft')

Вот относительно того, что я подчеркнул. Дело в том, что порядковый номер категорий на форуме получается не для всех одинаковым. Связано это с видимостью или не видимостью отдельных форумов для отдельных групп. Поэтому, если у тебя, как у администратора будет стоять первой "Администраторская", то для гостей и всех остальных первым будет тот форум, что у тебя идёт уже вторым. И иконки попросту подвинутся...

0

Поделиться9Вс, 5 Сен 2010 19:02:48

Автор: Romych
drumman
Зарегистрирован: Вт, 16 Дек 2008
Сообщений: 2708
Уважение: +4085
Позитив: +2378
Пол: Мужской
Последний визит:
Пн, 18 Ноя 2024 23:40:35

rps написал(а):

Вот относительно того, что я подчеркнул. Дело в том, что порядковый номер категорий на форуме получается не для всех одинаковым. Связано это с видимостью или не видимостью отдельных форумов для отдельных групп. Поэтому, если у тебя, как у администратора будет стоять первой "Администраторская", то для гостей и всех остальных первым будет тот форум, что у тебя идёт уже вторым. И иконки попросту подвинутся...

не пробовал вариант с скрытыми категориями, подумаю

хотя при сохранении смещение иконок, если и произойдёт, то это сразу обнаружится и поправимо

0

Instagram drumman.1

Поделиться10Пт, 10 Сен 2010 19:00:26

Автор: Romych
drumman
Зарегистрирован: Вт, 16 Дек 2008
Сообщений: 2708
Уважение: +4085
Позитив: +2378
Пол: Мужской
Последний визит:
Пн, 18 Ноя 2024 23:40:35

немного сократил код в скрипте
присвоил картинкам класс и задал общий стиль, так будет правильнее

<script type="text/javascript">
$(document).ready(function(){
$('div#pun-category1.category > h2 > div.catleft ').after('<img class="categor" src="http://icons.iconarchive.com/icons/icons-land/points-of-interest/32/Theater-Yellow-2-icon.png" />');
$('div#pun-category2.category > h2 > div.catleft').after('<img class="categor" src="http://icons.iconarchive.com/icons/rokey/hardware/32/harddisc-icon.png" />');
$('div#pun-category3.category > h2 > div.catleft').after('<img class="categor" src="http://icons.iconarchive.com/icons/deleket/gloss-adobe/32/Adobe-Flash-Player-icon.png" />');
$('img.categor').css({'margin-top' : '-7px', 'margin-left' : '-5px', 'margin-right' : '15px', 'margin-bottom' : '-9px'});
});
</script>

+1

Instagram drumman.1

Поделиться11Вс, 12 Сен 2010 18:37:11

Автор: Shadow the hedgehog
Заслуженный
Зарегистрирован: Чт, 12 Авг 2010
Сообщений: 32
Уважение: 0
Позитив: 0
Последний визит:
Сб, 25 Сен 2010 23:27:49

спасибо вам большое

0

Поделиться12Ср, 15 Сен 2010 00:20:41

Автор: Romych
drumman
Зарегистрирован: Вт, 16 Дек 2008
Сообщений: 2708
Уважение: +4085
Позитив: +2378
Пол: Мужской
Последний визит:
Пн, 18 Ноя 2024 23:40:35

я тут в 7 посте рекомендовал поставить в html-верх скриптовую библиотеку jquery

и с удивлением сегодня обнаружил, что на сервисе mybb она уже установлена (видимо недавно) на всех форумах по-умолчанию и не требуется её подгружать извне
ура товарищи!!! свершилось!
странно только, что это никак не афишировалось

0

Instagram drumman.1

Поделиться13Ср, 15 Сен 2010 16:50:01

Автор: rps
Стремясь к новому...
Зарегистрирован: Вс, 12 Окт 2008
Сообщений: 22652
Уважение: +4738
Позитив: +3431
Пол: Мужской
Предупреждения: ‡ 1. 2. 3. ... 10!
Последний визит:
Вс, 14 Мар 2021 21:42:57

Romych
Слушай, а ведь точно.

Может что-то готовится, какое-то обновление?

0

Поделиться14Ср, 15 Сен 2010 20:05:22

Автор: Romych
drumman
Зарегистрирован: Вт, 16 Дек 2008
Сообщений: 2708
Уважение: +4085
Позитив: +2378
Пол: Мужской
Последний визит:
Пн, 18 Ноя 2024 23:40:35

судя по всему jquery понадобилась Максу, теперь библиотека торчит рядом с http://forum.mybb.ru/js/swfobject.2.2b.js , которую Макс использует для рекламы,

а люди, которые используют облако тегов ошибочно подгружают swfobject.2.2b.js извне, не обращая внимания, что скрипт на сервисе уже давным давно есть

0

Instagram drumman.1

Поделиться15Чт, 21 Окт 2010 10:43:37

Автор: Deff
Тутошний...
Зарегистрирован: Ср, 16 Июн 2010
Сообщений: 51422
Уважение: +15369
Позитив: +11881
Последний визит:
Вчера 22:40:31

rps написал(а):

Вот относительно того, что я подчеркнул. Дело в том, что порядковый номер категорий на форуме получается не для всех одинаковым. Связано это с видимостью или не видимостью отдельных форумов для отдельных групп. Поэтому, если у тебя, как у

Romych написал(а):

не пробовал вариант с скрытыми категориями, подумаю
хотя при сохранении смещение иконок, если и произойдёт, то это сразу обнаружится и поправимо

Есть идея, устанавливать Иконки и планки под категории не по ID категории, а по поиску названия категории, тогда вроде как и не смещацо будут при скрытых разделах для разных групп...?

Отредактировано Deff (Чт, 21 Окт 2010 10:45:22)

0

Поделиться16Чт, 21 Окт 2010 18:36:01

Автор: rps
Стремясь к новому...
Зарегистрирован: Вс, 12 Окт 2008
Сообщений: 22652
Уважение: +4738
Позитив: +3431
Пол: Мужской
Предупреждения: ‡ 1. 2. 3. ... 10!
Последний визит:
Вс, 14 Мар 2021 21:42:57

Deff написал(а):

Есть идея

См. 6 сообщение.

0

Поделиться17Пт, 22 Окт 2010 00:20:05

Автор: Deff
Тутошний...
Зарегистрирован: Ср, 16 Июн 2010
Сообщений: 51422
Уважение: +15369
Позитив: +11881
Последний визит:
Вчера 22:40:31

rps написал(а):

См. 6 сообщение.

:cool: Cпс

0

Поделиться18Пт, 22 Окт 2010 01:27:59

Автор: Romych
drumman
Зарегистрирован: Вт, 16 Дек 2008
Сообщений: 2708
Уважение: +4085
Позитив: +2378
Пол: Мужской
Последний визит:
Пн, 18 Ноя 2024 23:40:35

Deff написал(а):

Есть идея, устанавливать Иконки и планки под категории не по ID категории, а по поиску названия категории, тогда вроде как и не смещацо будут при скрытых разделах для разных групп...?

на jquery пашин вариант можно сделать короче
получится так:

<script type="text/javascript">
$(function(){
$('.category > h2 span:contains("Название категории")').before('<img class="categor" src="изображение иконка" /> ');
$('img.categor').css({'margin-top' : '-7px', 'margin-left' : '-5px', 'margin-right' : '15px', 'margin-bottom' : '-9px'});
});
</script>

вот эту строку размножаем под каждую категорию:
$('.category > h2 span:contains("Название категории")').before('<img class="categor" src="изображение иконка" /> ');

+2

Instagram drumman.1

Единый форум поддержки

Меню навигации

Пользовательские ссылки

Информация о пользователе

Иконка рядом с названием категории

Сообщений 1 страница 18 из 18

Поделиться1Чт, 26 Авг 2010 13:20:46

Поделиться2Чт, 26 Авг 2010 15:27:37

Поделиться3Чт, 26 Авг 2010 18:13:05

Поделиться4Чт, 26 Авг 2010 19:28:56

Поделиться5Чт, 26 Авг 2010 20:05:04

Поделиться6Пт, 27 Авг 2010 08:54:58

Поделиться7Вс, 5 Сен 2010 13:25:28

Поделиться8Вс, 5 Сен 2010 16:23:39

Поделиться9Вс, 5 Сен 2010 19:02:48

Поделиться10Пт, 10 Сен 2010 19:00:26

Поделиться11Вс, 12 Сен 2010 18:37:11

Поделиться12Ср, 15 Сен 2010 00:20:41

Поделиться13Ср, 15 Сен 2010 16:50:01

Поделиться14Ср, 15 Сен 2010 20:05:22

Поделиться15Чт, 21 Окт 2010 10:43:37

Поделиться16Чт, 21 Окт 2010 18:36:01

Поделиться17Пт, 22 Окт 2010 00:20:05

Поделиться18Пт, 22 Окт 2010 01:27:59