使用 mCustomScroll(v3.1.5) 时,jqgrid 顶部标题不随左滚动移动
Posted
技术标签:
【中文标题】使用 mCustomScroll(v3.1.5) 时,jqgrid 顶部标题不随左滚动移动【英文标题】:jqgrid top header not moving with left scroll , when used mCustomScrol(v3.1.5) 【发布时间】:2018-01-07 23:31:44 【问题描述】:我正在尝试在 jqgrid(4.9.2) 上使用 mCustomScrollbar。滚动条的设计正在发生变化,但是当水平滚动时,顶部标题不会像往常一样移动。 我正在尝试处理的示例是可折叠网格。 对于 mCustomScroll
$(".ui-jqgrid-bdiv").mCustomScrollbar(
axis:"yx",
);
在 jqgrid 上根本不能使用任何自定义滚动条吗?
【问题讨论】:
你不应该使用任何产品的复古版本。 Free jqGrid 4.9.2 已经两岁了。我在 4.9.2 之后发布了 14 个更新的版本。请使用最新发布的 4.14.1 或 GitHub 上的最新代码(初步代码 4.15.0)。此外,只有能够重现您报告的问题,才能帮助您。因此,强烈建议包含重现问题的演示(例如在 jsfiddle 中)。可以从the page获取demo作为基础进行修改。 【参考方案1】:我对 jqgr 进行了一些自定义更改,因此迁移到其他版本将是一项艰巨的任务,因此,我在 mcustomscrollbar 中进行了更改并发布了答案,以便其他人来在同样的问题上,这将是有益的。 所以有一个方法_tweetTo,通过初始化为分配滚动条的容器调用它
$(".ui-jqgrid-bdiv").mCustomScrollbar(
axis:"yx",
);
现在在方法调用之后_tweenTo(line# 2131 for V:3.1.5)插入以下代码
if ($(".ui-jqgrid-hdiv").length > 0)
$(".ui-jqgrid-view").css("overflow", "hidden");
$(".ui-jqgrid-hdiv").css("width", $("#grid1").width() + "px"); // grid1 is the id of your gridcontainer/table
_tweenTo($(".ui-jqgrid-hdiv")[0], property, Math.round(scrollTo[0]), dur[0], options.scrollEasing, options.overwrite,
onStart: function ()
if (options.callbacks && options.onStart && !d.tweenRunning)
/* callbacks: onScrollStart */
if (_cb("onScrollStart")) _mcs(); o.callbacks.onScrollStart.call(el[0]);
d.tweenRunning = true;
_onDragClasses(mCSB_dragger);
d.cbOffsets = _cbOffsets();
, onUpdate: function ()
if (options.callbacks && options.onUpdate)
/* callbacks: whileScrolling */
if (_cb("whileScrolling")) _mcs(); o.callbacks.whileScrolling.call(el[0]);
, onComplete: function ()
if (options.callbacks && options.onComplete)
if (o.axis === "yx") clearTimeout(mCSB_container[0].onCompleteTimeout);
var t = mCSB_container[0].idleTimer || 0;
mCSB_container[0].onCompleteTimeout = setTimeout(function ()
/* callbacks: onScroll, onTotalScroll, onTotalScrollBack */
if (_cb("onScroll")) _mcs(); o.callbacks.onScroll.call(el[0]);
if (_cb("onTotalScroll") && scrollTo[1] >= limit[1] - totalScrollOffset && d.cbOffsets[0]) _mcs(); o.callbacks.onTotalScroll.call(el[0]);
if (_cb("onTotalScrollBack") && scrollTo[1] <= totalScrollBackOffset && d.cbOffsets[1]) _mcs(); o.callbacks.onTotalScrollBack.call(el[0]);
d.tweenRunning = false;
mCSB_container[0].idleTimer = 0;
_onDragClasses(mCSB_dragger, "hide");
, t);
);
在_tweenTo的方法定义中还有另外一个方法_tween 将该方法更新为
function _tween()
// added condition so the top headers remains fixed
if (el.classList.contains("ui-jqgrid-hdiv") && prop == "top")
return;
//ends here
if (duration > 0)
tobj.currVal = _ease(tobj.time, from, diff, duration, easing);
elStyle[prop] = Math.round(tobj.currVal) + "px";
else
elStyle[prop] = to + "px";
onUpdate.call();
滚动条已启动并正在运行.. !!
【讨论】:
以上是关于使用 mCustomScroll(v3.1.5) 时,jqgrid 顶部标题不随左滚动移动的主要内容,如果未能解决你的问题,请参考以下文章
iterm2 mac (v3.1.5) 无法在当前桌面中使用热键打开