当大量内容需要显示在页面上，超出了可见区域。用户就不得不滚动鼠标查看。这是应该避免的。滚动鼠标越少，意味着用户体验越好。

        一个好办法是使用选项卡。选项卡允许将内容放在一个页面上，只需切换，不必滚动滚轮上下查看，方便了很多。

        本文目标就是创建一个Tab页面，能够做到：

1. 使用很少或不滚动即可查看页面。

2. 提供2-8个选项卡选项。

3. 启用cookies，这样刷新后用户仍然看到最后查看的选项卡。

4. 允许在一个选项卡中放置多个web部件。

        最终效果：

1. 下载页面并加载到SharePoint 2010实例中。

2. 添加web部件到页面，选择HTML表单Web部件。

3. 添加代码到HTML表单Web部件自定义选项卡。

步骤一：下载并加载页面。

        页面可以添加到任何文档库，所以部署起来比较灵活。也可以加载到根网站的页面布局哭中，在网站集所有网站中可用。基于本次讨论目的，不在讲述添加到页面布局库的过程。

        下一步要么输入本章末尾代码到空白.aspx页，要么解压缩.zip文件内容上载到文档或页面库中。

步骤二：添加Web部件

1. 打开你选作Tabs页的页面，网站操作--编辑页面，寻找Tab节。

2. 添加Web部件。

        为什么使用HTML表单Web部件呢，而不是内容编辑器Web部件？SharePoint 2010改变了内容编辑器的工作方式；更容易编辑内容，但是它会无理由的删除代码。所以使用HTML表单Web部件，因为它不评估你的代码。

步骤三：自定义Tabs

1. 编辑HTML表单Web部件，打开源编辑器输入下面代码：

        你需要决定选项卡的数目。通过添加<!--和-->注释掉选项卡。

        决定是否需要Tab页面帮助链接。如果不需要：

jQuery应用

        这个解决方案使用jQuery，因此必须加载jQuery。如果没有加载jQuery，则远程调用jQuery。确保站点拥有jQuery，这Tab页面才能工作。如果网站集母版页中已经有加载jQuery，Tab页面的脚本将检查是否加载。如果已经加载了，脚本不会加载另一个版本或拷贝。下面代码片评估站点的jQuery状态：

Tab页面布局代码

下面链接有完整的页面布局代码。有标准的SharePoint 页面布局代码，能布局并记忆最后浏览选项卡的脚本，以及CSS.

本机效果图