Html （CSS）单击菜单/下拉菜单并更改div

我不懂java，我刚刚开始接触html/css。我一直在谷歌搜索…得到了很多部分的例子，但我不知道如何让它们一起工作。我想点击一个图像，我用它作为一个按钮，并有两个列表项目显示。这两个列表项都有3个子列表项，每个子列表都有5个项。我知道html，但我似乎无法按照我的需要来设计它。以下是我想要的：

当我单击我时，House1和House2会下拉

然后，如果我选择House1，House2将消失，并且只显示House1的三个列表

从那个里，若我选择后院，我希望前院和侧边消失，只显示后院的五个项目

仔细看了之后，我发现这看起来有多混乱。我正试图在画图中画一些东西，稍后会更新帖子。我最接近我想要的是使用细节/摘要方法，但我无法显示：没有工作，我无法摆脱每个细节标签上的黑色箭头

编辑：以下是我在详细信息/摘要方法中的内容。请原谅我的间距太大了。。。

当我点击Area 1>East时，我想隐藏除Area 1、East及其中间的5个缩略图以外的所有内容。现在的情况是，西部和中部向一侧滑动，区域2仍显示在底部

<ul id="clickMe"><img src="buttonPic"/>



<li>House1
    <ul>
        <li>FrontYard
            <ul>
                <li>Stuff1</li>
                <li>Stuff2</li>
                <li>Stuff3</li>
                <li>Stuff4</li>
                <li>Stuff5</li>
            </ul>
        </li>
        <li>BackYard
            <ul>
                <li>Stuff1</li>
                <li>Stuff2</li>
                <li>Stuff3</li>
                <li>Stuff4</li>
                <li>Stuff5</li>
            </ul>
        </li>
        <li>Side
            <ul>
                <li>Stuff1</li>
                <li>Stuff2</li>
                <li>Stuff3</li>
                <li>Stuff4</li>
                <li>Stuff5</li>
            </ul>
        </li>
   </ul>
</li>






<li>House2
<ul>
        <li>FrontYard
            <ul>
                <li>Stuff1</li>
                <li>Stuff2</li>
                <li>Stuff3</li>
                <li>Stuff4</li>
                <li>Stuff5</li>
            </ul>
        </li>
        <li>BackYard
            <ul>
                <li>Stuff1</li>
                <li>Stuff2</li>
                <li>Stuff3</li>
                <li>Stuff4</li>
                <li>Stuff5</li>
            </ul>
        </li>
        <li>Side
            <ul>
                <li>Stuff1</li>
                <li>Stuff2</li>
                <li>Stuff3</li>
                <li>Stuff4</li>
                <li>Stuff5</li>
            </ul>
        </li>
   </ul></li>

---

不能是的直接后代。只有can.OT您尝试这样做的方式看起来很奇怪，而不是下拉树菜单UI的工作方式。显示某些已折叠的项目没有任何意义，但一旦选定另一个项目，就将其关闭。。。如果我没有弄错你的Q，那么就没有什么有意义的逻辑了。另外，你需要的不是Java，而是我建议你使用jQuery来简化DOM元素的操作。你也应该试着把你在解决你自己的问题上所做的事情贴出来。为我做这件事在这里不是一个预期的问题，所以。用我所拥有的更新。如果我把它说成是“为我做”的话，我很抱歉。我真的只是在动画和隐藏/显示方面遇到了麻烦。此外，侧边的黑色箭头只在Chrome中消失，firefox和safari显示了它们