菜单上↑ 下 ↓移动 的解决方法（jquery )

[LiloZhu]

HI ,
我想做一个web 左侧菜单， 菜单分级可以自动展开和折叠， 最主要的是 当左侧菜单内超出屏幕电脑web 当前页的高度时，左则菜单顶部的 ↑ 按钮自动变为活动状态 ，点击左侧菜单向上移动带出未显示的菜单内容项， 当发生向上↑ 移动后， 左则菜单底部的↓ 按钮自动变为活动状态，点击它可以让菜单内容项向下移动 .

请问大家有没有好的例子？ 最好是可以运行看到效 果的 ...

[LiloZhu]

求解决示例代码， 顶一下....

[Pretty夜晚]

真没见过，帮你顶一下

[漫舞云中影]

用JQuery UI的控件很容易实现。 比如Accordion控件。

[KK3K2005]

你肯定是 一个容器 放菜单 （但是设置了超出隐藏） 一个菜单列表 在容器里面 菜单变化了计算下高度 在改变上下剪头的状态

[LiloZhu]

有没有示例代码供我参考一下？

[jiangbai333]

<div>
<button>上移</button>
<p>asdasd</p>
<p>asdasd</p>
<p>asdasd</p>
</div>

[jiangbai333]

引用 6 楼 jiangbai333 的回复:

<div style='height:100px;overflow-x:hidden;'>
<button style='z-index:999'>上移</button>
<div id='box' style="position:relative;top:0px;">
<p>asdasd</p>
<p>asdasd</p>
<p>asdasd</p>
<p>asdasd</p>
<p>asdasd</p>
<p>asdasd</p>
<p>asdasd</p>
<p>asdasd</p>
<p>asdasd</p>
<p>asdasd</p>
<p>asdasd</p>
<p>asdasd</p>
<p>asdasd</p>
<p>asdasd</p>
<p>asdasd</p>
<p>asdasd</p>
<p>asdasd</p>
<p>asdasd</p>
<p>asdasd</p>
<div></div>
</div>

$('button').click(function(){
    var top = parseInt($('#box').css('top')) - 5;
    $('#box').css({top:top})
})

[jiangbai333]

上面是上移的 样式你自己改改 我做的不好看！ 下移parseInt($('#box').css('top')) + 5！ 其它细致的东西 你自己琢磨琢磨吧！