需求
SharePoint2010的默認的母板頁兼容性和適應性做的很好，兼容了IE7，IE8和IE8兼容模式，也自適應了瀏覽器的分辨率和IE窗體非全屏的大小。
但國內很多客戶，特別是給一般用戶使用SharePoint的時候，有一個經常提到的需求，就是一般用戶不要看到Ribbon，起初想法很簡單，CSS直接隱藏掉就好了啊，但事實不那么簡單，因為為了適應IE瀏覽器的高度，會有一個滾動條，而這個滾動條出現的判斷是和這個Ribbon的div相關的，並且這段腳本是微軟自己寫的，你不可能在短時間內把這個腳本看明白。
那么下面就要解決這個問題
最終效果
1. 一般用戶看到的頁面
2. 管理員看到的頁面
基本配置
1. 打開Microsoft SharePoint Designer
2. 打開網站集
3. 單擊All Files和_catalogs。
4. 展開_catalogs和masterpage，復制V4.master再粘貼，將v4_copy(1).master，重命名為MyMasterPage.master
5. 編輯MyMasterPage.maser，單擊Edit file。
6. 在head加入鏈接MasterPage.css, jquery-1.4.4.min.js和MasterPage.js
7. 在安裝SharePoint2010的服務器，在C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\ 創建MasterPage文件夾，在MasterPage文件夾下創建Css和Javascript文件夾，根據后綴名放入相應的3個文件。
用戶名部分
1. 在圖中的位置，方便用戶切換用戶名。
2. 這個div原來的位置在圖的位置，將其注釋或剪切刪除（注意用<!--->是無效的）
3. 將代碼拷貝到網頁的頂部，外面套一層class為masterpagetop的div中。
4. 打開MasterPage.Css，編寫樣式。
.masterpagetop{ background-color: #21374c; height: 30px;}
Logo的部分
1. 公司都要有Logo，注意背景圖片可以隨着拖動不受影響，沒有留白或滾動條。
2. 在MyMasterPage.maser中設置div。
3. 在MyMasterPage文件夾下建Image文件夾，里面放置相關的圖片。一個是圖標，一個是背景延伸的圖片。
5. 打開MasterPage.Css，編寫樣式。
.masterpagelogobg{background: url(/_layouts/MyMasterPage/Image/LogoBg.jpg) repeat-x; height: 66px;}
.masterpagelogo{background: url(/_layouts/MyMasterPage/Image/Logo.jpg) no-repeat; height: 66px;}
頂部站點的導航部分
1. 當網站集下有多個網站，或者有其他導航設置，那么用SharePoint默認的導航控件比較好。
2. 這個div原來的位置在圖的位置，將其注釋或剪切刪除
3. 將代碼拷貝到Logo部分的下面，外面套一層class為masterpagetoplinks的div中。
4. 打開MasterPage.Css，編寫樣式。
.masterpagetoplinks{ height:25px; overflow:hidden; border-bottom:1px solid #ccc; }
隱藏Ribbon控制彈出滾動條
1. 打開MasterPage.Css，編寫樣式。
#s4-titlerow{ display:none; height:0px; overflow:hidden;}
#s4-ribbonrow{ display:none; height:0px; overflow:hidden; }
.s4-specialNavLinkList{ display:none}
.s4-recentchanges{ display:none}
2. 編寫腳本代碼，有控制IE瀏覽器兼容性的，有控制滾動條的，有控制管理員賬號顯示Ribbon的。
$(document).ready
(
function () {
var userName = $(".s4-trc-container-menu a.ms-menu-a span").text();
var version_temp = $.browser.version;
//如果不是管理員頁面
if (userName != "系統帳戶" && userName != "SystemAdmin") {
//隱藏ribbon
if (Request("IsDlg") == "1") {
$(".masterpagetop").hide();
$(".masterpagelogobg").hide();
$(".masterpagetoplinks").hide();
} else {
$(window).resize(function () {
changheight();
});
}
} else {
if (Request("IsDlg") == "1") {
$(".masterpagetop").hide();
$(".masterpagelogobg").hide();
$(".masterpagetoplinks").hide();
} else {
$("#s4-titlerow").show();
$("#s4-ribbonrow").show();
}
}
//如果是IE7
if (version_temp == "7.0") {
if (Request("IsDlg") == "1") {
changwidth();
}
}
}
);
//自適應寬高
function changwidth() {
var _maxwidth = 400;
$("#s4-workspace div").each(function () {
if ($(this).width() > _maxwidth)
_maxwidth = $(this).width();
});
_maxwidth = _maxwidth + 60;
if (_maxwidth > screen.width) {
_maxwidth = screen.width - 150;
}
$("#s4-workspace").css({ "width": _maxwidth + "px" });
}
function changheight() {
var _maxheight = 300;
$("#s4-workspace div").each(function () {
if ($(this).height() > _maxheight){
_maxheight = $(this).height();
}
});
_maxheight = $(window).height() - 120;
if (_maxheight > screen.height) {
_maxheight = screen.height;
}
$("#s4-workspace").css({ "height": _maxheight + "px" });
}
function Request(strName) {
var strHref = window.document.location.href;
var intPos = strHref.indexOf("?");
var strRight = strHref.substr(intPos + 1);
var arrTmp = strRight.split("&");
for (var i = 0; i < arrTmp.length; i++) {
var arrTemp = arrTmp[i].split("=");
if (arrTemp[0].toUpperCase() == strName.toUpperCase()) return arrTemp[1];
}
return "";
}
彈出頁面效果
1. 一般用戶全屏狀態，打開一個高度比較高的列表，彈出頁面也沒有了Ribbon，SharePoint的確定和取消按鈕自動會出來。
2. 改變瀏覽器的高度，寬度
3. 默認的是IE8的模式，現在調整到IE7模式下看效果。
4. 再調整到IE8兼容模式下看效果。
5. 在Chrome瀏覽器下看效果
