javascript - 将垂直滚动条添加到 Google map 侧边栏

Question

我想知道是否有人可以帮助我。

下面的代码是我的网页的一部分，它为 Google map 创建了一个侧边栏。

// == rebuilds the sidebar to match the markers currently displayed == 
function makeSidebar() {
  var html = "";
  for (var i = 0; i < gmarkers.length; i++) {
    if (gmarkers[i].getVisible()) {
      html += '<a href="javascript:myclick(' + i + ')">' + gmarkers[i].myname + " - " + gmarkers[i].mydescription + '<\/a><br>';
    }
  }
  document.getElementById("sidebar").innerHTML = html;
}

我遇到的问题是，随着 map 标记列表的增加，滚动页面以查看所有条目变得越来越困难。

我想做的是创建一个垂直滚动条，以便于导航。我已经阅读了一些这方面的资料，我认为我说的是正确的，如果这是在 div 中，我可以使用 overflow?。但我不确定在使用 Javascript 时如何复制。

我只是想知道是否有人可以看看这个并提供一些指导我如何去做。

非常感谢和亲切的问候

Answer 1

要允许滚动 div，只需添加值为 scroll 的 css 属性 overflow - 您需要提供height 属性也是

example here

如果您的 sidebar 元素是一个 div，您可以应用以下内容:

#sidebar {
   overflow: scroll;
   height: 400px;
   width: 100px;
}

您需要根据需要更改 height 和 width 值....

scroll 的值表示:

The content is clipped and desktop browsers use scrollbars, whether or not any content is clipped. This avoids any problem with scrollbars appearing and disappearing in a dynamic environment. Printers may print overflowing content.

Docs for the overflow property here