菜单展示效果，紧急—————

菜单展示效果，紧急——————

日期：2014-05-16　浏览次数：20508 次

菜单展示效果求助，紧急——————

如上图，上面的是一级菜单，点击后左侧出现相应二级菜单，这个怎么实现的，或者这种效果叫什么名字？

------解决方案--------------------
div隐藏点击后显示光看你那张图看不出要什么效果啊
------解决方案--------------------

引用:

Quote: 引用:

div隐藏点击后显示  光看你那张图看不出要什么效果啊
  就是最上面的横排是一级菜单，点某个一级菜单对应二级菜单在左侧显示。
    如果一次性把所有菜单都加载出来，那么每个二级菜单对应的二级菜单都先放到各自div？那布局会不会很乱，好像div即便隐藏好像也是占用空间的吧。前台方面我是小白了，能否详细点

布局不会乱~~啥叫div占用空间？
------解决方案--------------------
你菜单里面的内容是静态的话你就放到div里面，二级菜单全部隐藏起来，点击一级菜单显示相应的二级菜单就可以了
------解决方案--------------------

引用:

Quote: 引用:

div隐藏点击后显示  光看你那张图看不出要什么效果啊
  就是最上面的横排是一级菜单，点某个一级菜单对应二级菜单在左侧显示。
    如果一次性把所有菜单都加载出来，那么每个二级菜单对应的二级菜单都先放到各自div？那布局会不会很乱，好像div即便隐藏好像也是占用空间的吧。前台方面我是小白了，能否详细点

不会乱啊，乱什么，display:none是不占用空间的

<div><a href="javascript:show('yyzx')">应用中心</a>　<a href="javascript:show('zhzx')">账号中心</a>　<a href="javascript:show('jygl')">交易管理</a></div>

<div id="dvMenu">

<div id="yyzx">应用中心<br />应用中心<br />应用中心</div>

<div id="zhzx" style="display:none">账号中心<br />账号中心</div>

<div id="jygl" style="display:none">交易管理<br />交易管理</div>

</div>

<script>

    function show(id) {

        var divs = document.getElementById('dvMenu').getElementsByTagName('div');

        for (var i = 0; i < divs.length; i++) 

            divs[i].style.display = divs[i].id == id ? 'block' : 'none';

    }

</script>

------解决方案--------------------
这就是一种页面菜单框架啊。顶部一级菜单，左侧“应用中心”为二级菜单，“手机充值”为三级菜单。通常结构为：
<body>
<table>
<head>
<tr><td>顶部一级菜单相关代码</td></tr>
<tr><td><iframe id="left" src="left.html" /> </td></tr> 左侧菜单页面为left.html
<tr><td><iframe id="main" src="main.html" /> </td></tr> 右侧为主页面 main.html展示内容
</head>
</table>

在当前通过iframe.contentWindow.xxxshowMenu()的方式来调用iframe页面的方法来改变菜单显示。

左侧菜单你可使用jquery的组件就行了，都比较好搞。
------解决方案--------------------

<div><a href="javascript:show('yyzx')">应用中心</a>　<a href="javascript:show('zhzx')">账号中心</a>　<a href="javascript:show('jygl')">交易管理</a></div>

<div id="dvMenu">

<div&n

免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。

菜单展示效果，紧急——————

相关资料更多>

推荐阅读更多>