Question

我正在尝试仅使用wp nav菜单和css显示第三层菜单项，但我没有运气。我的菜单结构如下：

Tier 1 Menu Item
Tier 1 Menu Item
Tier 1 Menu Item (Page Parent)
    Tier 2 Menu Item
    Tier 2 Menu Item
    Tier 2 Menu Item (Current Page)
        Tier 3 Menu Item (Current Page Child)
        Tier 3 Menu Item (Current Page Child)

我试图隐藏除当前页面的孩子以外的所有内容。 IE - 我想隐藏所有第1层和第2层菜单项，并仅显示当前页面中的第3层菜单项。

我的菜单有一个容器类.jo-child-menu，我正在使用以下css来尝试实现它：

ul.jo-child-menu li{display:none;}
ul.jo-child-menu ul.sub-menu li{display:none;}
ul.jo-child-menu ul.sub-menu li.current-page-item ul.sub-menu li{display:block;}

结果是没有显示任何菜单项。我已经尝试了很多其他的css行，但是所有这些行都给了我整个菜单，没有菜单，或只有第一或第二层菜单项。

Answer 1

您对此示例的看法

 <ul id="coolMenu">
    <li>
        <a href="#"> 
            <img src = "gear_icon.png" class = "nav" height = "20px" width = "20px" style="display:none">insertimage
        </a>
        <ul>
            <li>
                <a href = "#"> Colors </a>
                <ul>
                    <li><a href = "#"> Blue </a></li>
                    <li><a href = "#"> Green </a></li>
                    <li><a href = "#"> Red </a></li>
                </ul>

            </li>
            <li><a href="#">Background</a></li>
            <li><a href="#">Indulgentia</a></li>
        </ul>
    </li>
</ul>

http://jsfiddle.net/kisspa/2bqQL/

仅使用wp nav菜单显示当前页面子菜单

1 个答案: