Question

我需要构建宽度为100％的流体宽度导航系统，如下所示：http://nwhc.dylanparrin.com。只是想知道是否有一种方法我可以得到它，以便一旦点击子菜单，前一个菜单崩溃，现在有30％的页面用于最终内容，如果我能得到的话会很好至少80％（如在点击时用于将内容隐藏到左侧的菜单）。

请参见此处的图表：http://i.stack.imgur.com/qJIZB.png 这怎么可能？

最基本的问候，迪伦

Answer 1

基本上，您可以使用基本JavaScript中的简单内容重新创建外观：

只需根据需要调整可见/隐藏的代码，并根据需要更改“display1”，“display2”等。当扩展或签约时，他们都将独立行动并“推动”内容。

如果这是一个合适的解决方案，请选择它作为答案 - 谢谢！

<script type="text/javascript">  
<!--

    function Show_Stuff(Click_Menu)
    // Function that will swap the display/no display for
    // all content within span tags
    {
    if (Click_Menu.style.display == "none")
    {
    Click_Menu.style.display = "";
    }
    else
    {
    Click_Menu.style.display = "none";
    }
    }

-->
</script>


<div><a href="javascript:Show_Stuff(display1)">Link #1 (Hyperlink)</a></div>
<span ID="display1" style="display: none">
<table bgcolor="#cccccc">
<tr><td width='200' wrap>
This is the table that will appear when link #1 is clicked.
You can add in a <a target="_blank" href="http://www.yahoo.com">hyperlink</a>
or any other html
</td>

</tr>
</table>
</span>


<div><a href="javascript:Show_Stuff(display2)">Link #2 (Hyperlink)</a></div>
<span ID="display2" style="display: none">
<table bgcolor="#ffcc00">
<tr><td width='200' wrap>
This is the table that will appear when link #2 is clicked.
You can add in a <a target="_blank" href="http://www.google.com">hyperlink</a>
or any other html
</td>

</tr>
</table>
</span>

带子菜单的可折叠Mac-like侧边栏导航

1 个答案: