日期:2014-05-16  浏览次数:20324 次

请求类似IE7选项卡效果
请求类似IE7选项卡效果,能简单说就是菜单,当超过固定宽度时,能根据按钮进行左右移动,例如下面菜单

<<菜单一 菜单二 菜单三 菜单四 菜单五 >> 

根据<< >>进行左右移动

请求各位了。

------解决方案--------------------
http://www.lihuajie.cn/code/0004.htm
------解决方案--------------------
用过Ext吗 ,里面有个TabPanel对象就ok了。就是你说的IE7选择卡。具体的例子可以找我。
------解决方案--------------------
HTML code
<style>
span.item{width:100px;height:100px;text-align:cente;background-color:red;color:white}
span.item1{width:100px;height:100px;text-align:cente;background-color:blue;color:white}
a.left{position:absolute;cursor:hand;top:20px;left:0px;}
a.right{position:absolute;cursor:hand;top:20px;left:320px;}
div.menu{position:absolute;overflow:hidden;width:302px;height:22px;border:solid 1px black;left:20px;top:20px}
</style>
<a class="left" onclick="Move('Left')">&lt;&lt;</a><div id="divMenu" class="menu"><pre>
<span class="item">菜单一</span><span class="item1">菜单二</span><span class="item">菜单三</span><span class="item1">菜单四</span><span class="item">菜单五</span>
</pre></div><a class="right" onclick="Move('Right')">&gt;&gt;</a>
<script>
var TotalItem=5;
var ListLastItemIndex=3;
function Move(Direction)
{
    if(Direction=="Left")
      $('divMenu').scrollLeft-=100;
    else
      $('divMenu').scrollLeft+=100;
    }
function $(id)
{
    return document.getElementById(id);
    }
</script>

------解决方案--------------------
ext的效果没的说