jquery - 使用滚动条插件与具有 100% 高度的 DIV

Question

我尝试使用 jQuery Scrollbar plugin使用我的 3 列布局(更新:现在切换到 slimScroll 插件)。 3 列应使用 100% 浏览器高度。这个想法是滚动条仅在悬停相应列时出现。

在我的布局中，滚动条无法正常工作。每次调整窗口大小时我都已经调用了该函数(我最初试图避免这样做，因为从我的角度来看，这是一个黑客行为):

$(window).resize(function()

这是 fiddle 。

初始化滚动条的代码位于第 226 行(在我粘贴 jquery.slimscroll.js 之前)。

function setFrameSizes() {
  console.log("Set scrollbar");
  $('.inner').slimScroll({
    height: $(window).height() - 46
  });
}

$(document).ready(function() {
  setFrameSizes();
});
$(window).resize(function() {
  setFrameSizes();
});

Answer 1

假设每个div的高度相同:

var myHeight = $('.myDiv').height();
$(".myDiv").slimscroll({
    wheelStep: 20,
    color: '#fff',
    height: myHeight
});

如果情况并非如此，那么您可以尝试通过 ID 引用每个 div，或者类似这样的内容:

$(".myDiv").each(function(){
     var myHeight = $(this).height();
     $(this).slimscroll({
        wheelStep: 20,
        color: '#fff',
        height: myHeight
      });

});