Как задать прозрачный угол шестиугольника только на последних <li>?

Question

Я должен сделать меню, как это. альтернативный текст http://shup.com/Shup/330421/1104422739-My-Desktop.png

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

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

Answer 1

Использование демонстрации угла jQuery :

$("#item3 li:last").corner("br bevel");

Answer 2

Проверьте Сын Suckerfish выпадающее меню. Требуемый особый стиль потребует, чтобы класс был назначен последнему <li> в любом <ul>

Answer 3

Использование HTML 5

<nav>
<ul>
<li><a href="">Item 1</a></li>
<li><a href="">Item 2</a></li>
<li><a href="">Item 3</a>
    <ul>
    <li>Item 3.1</li>
    <li>Item 3.2</li>
    <li>Item 3.3</li>
    <li>Item 3.4</li>
    </ul>
</li>
<li>etc......
</ul>
</nav>

CSS

пограничный нижний правый образ:

Answer 4

Вы можете изменить непрозрачность элементов с помощью CSS, это будет работать со всеми основными браузерами:

.transparent_class {
    filter:alpha(opacity=50);
    -moz-opacity:0.5;
    -khtml-opacity: 0.5;
    opacity: 0.5;
}

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

$("#item3 li:last").addClass("special_corner");

UPDATE

почему бы вам не взглянуть на JQuery Corner Demo