0

我有使用 jQuery 的 jScrollPane 插件的滚动条。

滚动条有效，所有内容都使用 AJAX，因此对于每个“页面”加载，我都会添加滚动条的重新初始化。但是当内容比页面短时，滚动条是不可见的。

这会导致内容有 10 像素的额外空间，这对于使用 100% 可用空间的项目来说很烦人。

即使内容不可用，任何人都知道如何使滚动条可见？或者另一种保留空间的 CSS 方式也可以。

4

2 回答 2

1

如果没有人找到更好的解决方案，

我已经可以说我修改了 jScrollPane 插件，以始终显示“轨道”栏，如果它要隐藏滚动条（因为内容小于视图），我也不会附加“拖动”栏。虽然它不是一个非常干净的选择。

应该更进一步，并且还禁用/重新启用向上向下按钮，添加 css 功能以在禁用时不执行悬停/活动状态......以获得更好的可用性。

仍然期待一个可能的更好的解决方案，虽然我觉得我会想出唯一可能的解决方案，因为可能没有开箱即用的解决方案

于 2010-07-25T01:10:57.507 回答
1

我认为在将这个功能添加到 jScrollPane 之前，只有一些肮脏的技巧可以解决这个问题。我所做的是询问 jScrollPane 是否启用了滚动；如果没有，我添加了一个看起来像空/禁用滚动条的 div。这是代码：

var scrollPane = $("#id-of-scroll-area");
scrollPane.css("height", "100%"); // I needed this; you may not
var scroll = scrollPane.jScrollPane();
// check if scrolling is enabled
if (!scroll.data('jsp').getIsScrollableV()) {
  scrollPane.css("overflow-y", "hidden");
  scrollPane.css("width", leftPane.width() - 10); // 10 is width of scroll bar
  scrollPane.after('<div id="white-v-bar">&nbsp;</div>');   
}

跳这可以帮助某人...马库斯

这是虚拟滚动条的 CSS：

#white-v-bar {
 height:100%;
 width:10px;
 background-color:white;
 float:left;
}
于 2011-08-25T10:26:39.033 回答