[Решено]JS/HTML/API добавление уникальных классов для элементов меню

Главные вкладки

Аватар пользователя makkon makkon 18 января 2012 в 15:18

Добрый день. Есть такой кусок html

<li class="leaf dhtml-menu ">
<span class="seperator">--------</span>
</li>

.separator формируется special menu items модулем.
Для элемента списка есть свойство:

.region-sidebar-first .block li.leaf
{
        list-style-image: url("../images/arrow-right.png");
}

Вопрос- как заменить свойство на list-style-image:none?
Думается это сниппетом каким делается, да вот не силен.

Комментарии

Аватар пользователя makkon makkon 18 января 2012 в 16:12

ну уж такие решения по-моему глупы.
это уберет картинки для всех li.leaf. мне то нужно только для элементов li.leaf, у которых дочерний с классом separator

это реализовано в поздних версиях модуля SMI, но я использую dhtml_menu и они конфликтуют. к тому же dhtml_menu патченный для работы только по щелчку на изображение.

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

Аватар пользователя makkon makkon 18 января 2012 в 18:16

6RUN0, ну абсолютно такое же решение что и выше. ясен перец, что абсолютно все li имеют класс .dhtml-menu.
то есть

<li class="leaf dhtml-menu">
<span>линк</span>
</li>
<li class="leaf dhtml-menu">
<span>линк</span>
</li>
<li class="leaf dhtml-menu">
<span>линк</span>
</li>

вот сообразил решение из другого найденного на д.орг

<?php/*Уникальные id для меню*/
function it_resurs_menu_item($link, $has_children, $menu = '', $in_active_trail = FALSE, $extra_class = NULL) {
  $class = ($menu ? 'expanded' : ($has_children ? 'collapsed' : 'leaf'));
  if (!empty($extra_class)) {
    $class .= ' '. $extra_class;
  }
  if ($in_active_trail) {
    $class .= ' active-trail';
  }
  $id = preg_replace("/[^a-zA-Z0-9]/", "", strip_tags($link));
  if (empty($id))
  {
     $id .= 'nolink';
  }
  return '<li id="'.$id.'" class="'. $class .'">'. $link . $menu ."</li>\n";
}?>

получаем, что к нашим li подставится уникальные id, нужно додумать тока для русских символов, иначе ставит nolink ко всем русским пунктам

есть додумки?

Аватар пользователя 6RUN0 6RUN0 18 января 2012 в 18:34

Я не телепат как изначально вопрос написан - таков и ответ.
Написал бы сразу: нужно для каждого тега <li> в меню генерить уникальный класс;
или в зависимости от региона, в котором располагается меню, менять стиль тега <li>.
или ...
вариаций куча

Аватар пользователя makkon makkon 18 января 2012 в 19:35

а что не так было написано? спрашивал как дописать класс для li элемента, если у него дочерний элемент с классом seperator. либо изменить css свойство у родителя, дочерним у которого является span.separator
кусок html был именно для того, чтобы показать как выглядит этот кусок.

начинают совать какую-то ересь css, которую наверно даже школьник знает (тут зря походу написал в заголовке css, тока им решить не получится)

итак, пока у меня вот такое решение:

<?phpfunction rus2translit($string)
{
    $converter = array(
        'а' => 'a',   'б' => 'b',   'в' => 'v',
        'г' => 'g',   'д' => 'd',   'е' => 'e',
        'ё' => 'e',   'ж' => 'zh',  'з' => 'z',
        'и' => 'i',   'й' => 'y',   'к' => 'k',
        'л' => 'l',   'м' => 'm',   'н' => 'n',
        'о' => 'o',   'п' => 'p',   'р' => 'r',
        'с' => 's',   'т' => 't',   'у' => 'u',
        'ф' => 'f',   'х' => 'h',   'ц' => 'c',
        'ч' => 'ch',  'ш' => 'sh',  'щ' => 'sch',
        'ь' => "'",  'ы' => 'y',   'ъ' => "'",
        'э' => 'e',   'ю' => 'yu',  'я' => 'ya',
 
        'А' => 'A',   'Б' => 'B',   'В' => 'V',
        'Г' => 'G',   'Д' => 'D',   'Е' => 'E',
        'Ё' => 'E',   'Ж' => 'Zh',  'З' => 'Z',
        'И' => 'I',   'Й' => 'Y',   'К' => 'K',
        'Л' => 'L',   'М' => 'M',   'Н' => 'N',
        'О' => 'O',   'П' => 'P',   'Р' => 'R',
        'С' => 'S',   'Т' => 'T',   'У' => 'U',
        'Ф' => 'F',   'Х' => 'H',   'Ц' => 'C',
        'Ч' => 'Ch',  'Ш' => 'Sh',  'Щ' => 'Sch',
        'Ь' => "'",  'Ы' => 'Y',   'Ъ' => "'",
        'Э' => 'E',   'Ю' => 'Yu',  'Я' => 'Ya',
    );
    return strtr($string, $converter);
}

/*Уникальные id для меню*/
function it_resurs_menu_item($link, $has_children, $menu = '', $in_active_trail = FALSE, $extra_class = NULL) {
  $class = ($menu ? 'expanded' : ($has_children ? 'collapsed' : 'leaf'));
  if (!empty($extra_class)) {
    $class .= ' '. $extra_class;
  }
  if ($in_active_trail) {
    $class .= ' active-trail';
  }
  //echo rus2translit($link);
  $id = preg_replace("/[^a-zA-Z0-9]/", "", strip_tags(rus2translit($link)));
  if (empty($id))
  {
     $id .= 'nolink';
  }
  return '<li id="'.$id.'" class="'. $class .'">'. $link . $menu ."</li>\n";
}?>

оно добавляет заголовок элемента меню в качестве id пункта меню.
получаем примерно такое:

<li id="Moyauchetnayazapis" class="leaf first dhtml-menu ">
<a id="dhtml_menu-21" href="/users/root">Моя учетная запись</a>
</li>
<li id="Redaktirovatbloki" class="leaf dhtml-menu ">
<a ... </a>
<li id="Sozdatpublikaciyu" class="dhtml-menu branch collapsed start-collapsed ">
<a ... </a> ....

соответственно выцепить нужное мне поле легко - оно будет с классом nolink. решение топорное, поэтому прошу помочь с другими вариантами, думаю они есть и гораздо более простые и меньше придется изменять структуру вывода li.leaf.

Аватар пользователя makkon makkon 18 января 2012 в 20:21

а вот и изящное решение:

function названиетемы_menu_item($link, $has_children, $menu = '', $in_active_trail = FALSE, $extra_class = NULL) {
  $class = ($menu ? 'expanded' : ($has_children ? 'collapsed' : 'leaf'));
  if (!empty($extra_class)) {
    $class .= ' '. $extra_class;
  }
  if ($in_active_trail) {
    $class .= ' active-trail';
  }
 
  if(strpos($link,'class="nolink"')!==false) {
    $class.=' nolink-li';
  }
if(strpos($link,'class="seperator"')!==false) {
    $class.=' separator-li';
  }
  return '<li class="'. $class .''.$id.'">'. $link . $menu ."</li>\n";
}

тут же можно вывести и уникальные id/class для li при желании