自定义母版页之列表过滤菜单位置issue fix
问题描述:
自定义母版页,为了使左边导航和顶部导航位置不变(不滚动),将原本位于ribbon下方的#s4-workspace调整到左侧导航右边。
<div id="s4-workspace" style="position: relative; margin-left: 155px; ">
body #s4-workspace {
overflow-y: scroll;
overflow-x: auto;
position: relative;
left: 0px;
}
这时,如果视图字段较多,需要往右滚动主区域,会出现过滤菜单被左侧导航压住的情况。
解决:
1) 修改web.config将编译模式调整为debug,这时候,moss会采用调试模式的js,如core.debug.js.
2)跟踪js代码,最终发现设置菜单位置的js函数位于Core.debug.js的SetMenuPosition
3)SetMenuPosition这个函数比较复杂,但是好在它是在最后设置菜单位置的:
oPopup.style.left=posLeft+"px";
oPopup.style.top=posTop+"px";
oPopup.LeftForBackIframe=posLeft;
oPopup.TopForBackIframe = posTop;
这样,我们就可以直接把代码附加到这个函数后面来修复菜单的位置。
修复逻辑:
1-检测菜单是否处于#s4-workspace内,若否,则不做操作(因为moss中的其他弹出菜单,包括网站操作,也是采用这个js来设置位置的)
2-如果菜单的left小于#s4-workspace的左侧滚动宽度,则将菜单的left设置为#s4-workspace的左滚动宽度(scrollLeft)
4)修该moss自带的js文件不是一个推荐的做法,因为系统升级的时候自带的js文件可能被覆盖掉。所以,这里采用一种类似于“重载”的方式。代码如下:
//fix function begin--------------------
//add by zjy to fix the filter menu is hidden by left bar issue
var defaultSetMenuPosition = SetMenuPosition;
SetMenuPosition = function (oMaster, oParent, oPopup, oInnerDiv, fFlipTop, fTopLevel) {
defaultSetMenuPosition(oMaster, oParent, oPopup, oInnerDiv, fFlipTop, fTopLevel);
var $parentWs = $(oPopup).closest("#s4-workspace");
if($parentWs.length==0)
return;
var wsScrollLeft = $parentWs.scrollLeft();
var leftStr = "" + oPopup.style.left;
var intMenuLeft = parseInt(leftStr.substring(0,leftStr.length-2)); //2px to 2
if(intMenuLeft<wsScrollLeft){
oPopup.style.left = wsScrollLeft + "px";
oPopup.LeftForBackIframe = wsScrollLeft;
}
}
//fix function end-----------------------
备注:
1)将以上函数添加到任意地方即可,如自定义的母版页中。
此函数依赖jquery,请确保母版页引用jquery.
因为core.js是采用SOD加载的,所以需要用ExecuteOrDelayUntilScriptLoaded确保SetMenuPosition函数已加载:
// Fix issue: popup menu was hidden by left menu bar.
ExecuteOrDelayUntilScriptLoaded(function () {
var defaultSetMenuPosition = SetMenuPosition;
SetMenuPosition = function (oMaster, oParent, oPopup, oInnerDiv, fFlipTop, fTopLevel) {
defaultSetMenuPosition(oMaster, oParent, oPopup, oInnerDiv, fFlipTop, fTopLevel);
var $parentWs = $(oPopup).closest("#s4-workspace");
if ($parentWs.length == 0)
return;
var wsScrollLeft = $parentWs.scrollLeft();
var leftStr = "" + oPopup.style.left;
var intMenuLeft = parseInt(leftStr.substring(0, leftStr.length - 2)); //2px to 2
if (intMenuLeft < wsScrollLeft) {
oPopup.style.left = wsScrollLeft + "px";
oPopup.LeftForBackIframe = wsScrollLeft;
}
}
}, "core.js")
</script>
2)为避免列表项上下文菜单位置异常,滚动条一定要设置在s4-workspace上。
自定义母版页之列表过滤菜单位置issue fix的更多相关文章
- 重新想象 Windows 8 Store Apps (69) - 其它: 自定义启动屏幕, 程序的运行位置, 保持屏幕的点亮状态, MessageDialog, PopupMenu
[源码下载] 重新想象 Windows 8 Store Apps (69) - 其它: 自定义启动屏幕, 程序的运行位置, 保持屏幕的点亮状态, MessageDialog, PopupMenu 作者 ...
- 自定义鼠标右键(层叠式菜单:cascading menu)
Author:KillerLegend From:http://www.cnblogs.com/killerlegend/p/3575391.html Date:Tuesday, February 1 ...
- 我的菜单在母版页,如何更改菜单点击后的效果 Ver2
很久之前,Insus.NET使用ASP.NET实现一个功能,非javascript.<我的菜单在母版页,如何更改菜单点击后的效果>http://www.cnblogs.com/insus/ ...
- JavaScript 自定义html元素鼠标右键菜单
自定义html元素鼠标右键菜单 实现思路 在触发contextmenu事件时,取消默认行为(也就是阻止浏览器显示自带的菜单),获取右键事件对象,来确定鼠标的点击位置,作为显示菜单的left和top值 ...
- Sharepoint2010设置自定义母版页
前言 这个文档是为Microsoft Sharepoint2010 上海文档库公司站点设计的母版页,其版本为1.0,为相关的源文件编写的使用说明书. 使用SharePoint Designer 201 ...
- .NET混合开发解决方案13 自定义WebView2中的上下文菜单
系列目录 [已更新最新开发文章,点击查看详细] WebView2控件应用详解系列博客 .NET桌面程序集成Web网页开发的十种解决方案 .NET混合开发解决方案1 WebView2简介 .NE ...
- 17_Vue列表过滤_js模糊查询
列表过滤 需求分析 这里呢有张列表,假设这个列表有一百多条数据 当我在这个 搜索框当中 搜索 单个关键字的时候 (冬,周,伦),它能把带了这几个关键字的信息都给我罗列出来 === 跟数据库的 模糊查询 ...
- jQuery自定义Web页面鼠标右键菜单
jQuery自定义Web页面鼠标右键菜单 右键菜单是固定的,很多时候,我们需要自定义web页面自定义菜单,指定相应的功能. 自定义的原理是:jQuery封装了鼠标右键的点击事件(“contextmen ...
- log4.net 配置 - 自定义过滤器按LoggerName过滤日志
自定义过滤器按LoggerName过滤日志,本来想使用 PropertyFilter 来实现,后来研究发现一直不能成功,源代码debug了一下获取一直为null,时间关系只好用 StringMatch ...
随机推荐
- vue中v-bind:class动态添加class
1.html代码 <template v-for='item in names'> <div id="app" class="selectItem&qu ...
- TextView跑马灯效果
转载:http://www.2cto.com/kf/201409/330658.html 一.只想让TextView显示一行,但是文字超过TextView的长度怎么办?在开头显示省略号 android ...
- iOS开发之窥探UICollectionViewController(三) --使用UICollectionView自定义瀑布流
上篇博客的实例是自带的UICollectionViewDelegateFlowLayout布局基础上来做的Demo, 详情请看<iOS开发之窥探UICollectionViewControlle ...
- iOS开发之多图片无缝滚动组件封装与使用
经常有园友会问"博主,有没有图片无限滚动的Demo呀?", 正儿八经的图片滚动的Demo我这儿还真没有,今天呢就封装一个可以在项目中直接使用的图片轮播.没看过其他iOS图片无限轮播 ...
- II7.0 发布 MVC 4.0 三个小问题记录
1,403.14-Forbidden Web 服务器被配置为不列出此目录的内容 根据提示更改:使用 IIS 管理器启用目录浏览. 打开 IIS 管理器. 在“功能”视图中,双击“目录浏览”. 在“目录 ...
- ZOJ Problem Set - 1350 The Drunk Jailer ac代码 memset
这是一道很简单的题目,题目大概意思说下:就是有n个监狱(编号从1到n),第一次全部打开,第二次打开编号为2的倍数的,第三次打开编号为3的倍数的,以此类推...最后问你有几个监狱是打开的 题目中我使用了 ...
- MongoDB - basic
mongoDB basic from:http://www.tutorialspoint.com/mongodb prject:https://github.com/chenxing12/l4mong ...
- EntityFramework查询--联合查询(Join,GroupJoin)
首先我们先看一下Join public static IEnumerable<TResult> Join<TOuter, TInner, TKey, TResult>(this ...
- Redis命令拾遗四——集合类型(命令补充)
补充下上篇文章集合的命令. 上篇地址 博客园蜗牛 http://www.cnblogs.com/tdws/p/5785939.html SCARD Key获得执行集合中元素的数量. SDIFFSTOR ...
- Android按返回键退出程序但不销毁,程序后台保留
重写onKeyDown事件即可 @Overridepublic boolean onKeyDown(int keyCode, KeyEvent event) { if (keyCode == KeyE ...