Question

尝试让此侧边栏可滚动。现在，您可以通过单击其中的项目来浏览它（使用jQuery在点击项目时为边距设置动画），但我也想添加滚动功能。

我试过溢出：滚动没有成功。有帮助吗？

$('.track-name').click(function() {

  //Remove active class from all other track names
  $('.track-name').not(this).removeClass('active');

  //Add active class on clicked track name
  $(this).addClass('active');

  var id = $(this).attr("data-id");

  var scrollAmount = id * -50;
  console.log(scrollAmount);

  $('.track-name-inner').animate({ marginTop: scrollAmount }, 300);

});

Answer 1

不确定为什么当我点击它们时它们会消失但是没关系。

您需要在容器上设置显式高度以便溢出：滚动到工作。

工作代码： https://codepen.io/anon/pen/ZvXpva

.track-name-wrapper {
  position: absolute;
  left: 35px;
  top: 50%;
  width: 300px;
  display: inline-block;
  height: 300px; 
  overflow-y: scroll;
  top: 150px; 
}

在没有滚动条的情况下滚动div

1 个答案: