[SharePoint] 隐藏"QuickLaunch"菜单

     很多时候 QuickLaunch 菜单是如此的好用,但它同样也占用很多屏幕空间,特别是很多用户的显示器的分辨率并不高。

  • 烹饪类型

          JavaScript

  • 原料

          这道菜你所需要的是一些JavaScript知识和懂一些如何让CSS样式工作。你也许用得到Content Editor web part来放你的JavaScript脚本。

  • 准备工作

          1. 在浏览器中打开一个SharePoint站点,你至少要拥有站点的设计权限。

          2. 添加Content Editor web part到页面上。

          3. 在Content Editor web part的菜单上选择修改选项。

          4. 点击Source Editor按钮。

          5. 输入JavaScript脚本按照下面的烹饪指导。

  • 操作流程

          1. 写两个<A>元素在页面上,一个用来显示连接,另一个用来隐藏链接。

          2. 调用getElementsByClass()来创造一个数组放置页面上引用"ms-nav"样式的所有元素。

          3. 读取isQuickLaunchHidden这个浏览器Cookie参数来判断QuickLaunch的初始状态。

          4. 如果是显示状态,那么设置每个元素的"style.display"为空,否则设置为"none"。

  • 烹饪

<script>
// Step 1: Add <a> tags to page to hold hide/show options
document.write('<a id="HideOption" href="javascript:Hide();" style="display:none;">Hidden Quicklaunch menu</a>');
document.write('<a id="ShowOption" href="javascript:Show();">Show Quicklaunch menu</a>');

// Step 2: Declare an array containing a list
// of all page elements assigned the "ms-nav"
// class
var _NavElements = getElementsByClass("ms-nav");

// Step 3: Read user's current show/hide preference
// from local cookie
var isQuicklaunchHidden = readCookie('isQuicklaunchHidden');

// Step 4: Show or hide the quicklaunch
// depending on the user preference
if (isQuicklaunchHidden == 'true')
{
  Hide();
}
else
{
  Show();
}

// Helper function to save a cookie representing user-specific
// choice to show or hide the QuickLaunch menu
function createCookie(name,value,days)
{
  if (days)
  {
   var date = new Date();
   date.setTime(date.getTime()+(days*24*60*60*1000));
   var expires = "; expires="+date.toGMTString();
  }
  else
  {
   var expires = "";
  }
  document.cookie = name + "=" + value + expires + "; path=/";
}

// Helper function to read the cookie to determine whether
// the QuickLaunch menu should be displayed
function readCookie(name)
{
  var nameEQ = name + "=";
  var ca = document.cookie.split(';');
  for (var i=0; i < ca.length; i++)
  {
    var c = ca[i];
    while (c.charAt(0) == ' ') c = c.substring(1, c.length);
    if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
  }
 
  return null;
}

// Helper function to delete a specified cookie
function eraseCookie(name)
{
  createCookie(name,"",-1);
}

// Helper function to return an array of web-
// page elements of the specified class. This
// function is needed because SharePoint assigns
// the Quicklaunch a class, but not an ID.
// Otherwise, we could use the native
// GetElementById() Javascript function.
function getElementsByClass(searchClass,node,tag)
{
  var classElements = new Array();
  if (node == null)
    node = document;
  if (tag == null)
    tag = '*';
  var els = node.getElementsByTagName(tag);
  var elsLen = els.length;
  var pattern = new RegExp('(^|//s)'+searchClass+'(//s|$)');
  for (var i=0, j=0; i < elsLen; i++)
  {
    if (pattern.test(els[i].className))
    {
      classElements[j] = els[i];
      j++;
    }
  }
  return classElements;
}

// Helper function to hide the quicklaunch
function Hide()
{
  for (var i = 0; i < _NavElements.length; i++)
  {
    _NavElements[i].style.display = "none";
  }
  document.getElementById("HideOption").style.display = "none";
  document.getElementById("ShowOption").style.display = "";
  createCookie('isQuicklaunchHidden','true',365);
}

// Helper function to show the quicklaunch
function Show()
{
  for (var i = 0; i < _NavElements.length; i++)
  {
    _NavElements[i].style.display = "";
  }
  document.getElementById("HideOption").style.display = "";
  document.getElementById("ShowOption").style.display = "none";
  createCookie('isQuicklaunchHidden','false',365);
}
</script>

--------------------------------------------

 

Have fun... :-)

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值