选项卡效果在AJAX刚兴起的时候被不少网站应用在首页上，在有限的空间里容纳更多的内容。这个东西写法不少，其实原理很简单，就是层的显隐与样式替换。 我使用Prototype.js也写了一个可定义性高，易扩展，却非常简洁的代码。 我这里所写的选项卡并没有应用AJAX，只是一个最简单的Tab显示应用。结构层，表现层，行为层完全分离。前台结构也很简单，只使用一个ID。 最终效果：http://www.kxbd.com/mylab/080420tab/ 以下是HTML代码：【运行代码】【复制代码】 <div id="weekRank"> <div class="boxHead"> <ul> <li class="current">周点击</li> ...

在这期专栏中，我将说明如何翻新选项卡式面板使其能够在不支持标准的4.0版本的老浏览器中工作，我还会稍微地改善面板的界面使其能够更具吸引力。 在翻新原来的选项卡式面板时，选项卡和面板在 Navigator 4.0中将会缺少边界，但是其它功能在 Netscape Navigator 或 Microsoft Internet Explorer 中都会一样。点击一个选项卡将显示与其关联的面板；点击后端的一个选项卡可以将引起选项卡的行移至前端。这就是我前面提到的一点小的界面改进；它使得所有行中的面板表现为同一种方式，而且使组件的行为更加一致。不幸的是，它就使得该组件不能再在 Opera 上运行，因为Opera 不支持 CSS clip属性。 另外一个显示上的改进是该组件不再是...