Вертикальное навигационное меню jquery-ui с темами

Question

Я хотел бы иметь вертикальное навигационное меню, совместимое с jQuery UI ThemeRoller. Как я могу определить стили для моего меню? Я просто строю меню динамически и PHP-код выглядит следующим образом:

$menu = '<ul>';
foreach ($items as $val) {
    if ( 'sep' == $val['link'] )
        $menu.=$val['label'].'<br>';
    else {
      //  echo $_SERVER['SCRIPT_FILENAME']."<br>".DEF_PATH.$val['link'];

        if ($_SERVER['SCRIPT_FILENAME'] == DEF_PATH.$val['link']) {
            $menu .= '<li class="current"><a href="'.$val['link'].'"';
            $menu .= ' class="current"';
        }else
            $menu .= '<li><a href="'.$val['link'].'"';
        $menu .= ' target="'.$val['target'].'" '.'>'.$val['label']."</a></li>\n";
    }
}
$menu.="</ul>\n";
$main_menu.=$menu;

спасибо, Арман.

Answer 1

jQuery UI Использует "CSS Framework", вы можете прочитать об этом здесь . В основном он использует четко определенный набор классов для конкретных вещей, просто используйте соответствующие классы, включающие тему / CSS, которые вы хотите использовать, и все готово:)

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

<li class="current">

Вы, вероятно, захотите ui-state-active или ui-state-highlight либо заменить, либо дополнить current (кроме того, если .current имеет дополнительные правила стиля , которые вы хотите), например:

<li class="current ui-state-active">

Answer 2

Попробуйте добавить к ним display:block (пользовательский интерфейс мог сделать их встроенными):

$menu .= '<li style="display:block;"><a href="'.$val['link'].'"';