Question

我有一个嵌套列表，列出父节点展开时的子节点。通过单击文本左侧的图像来展开父节点。

不幸的是，它会在页面上展开。我想在内容离开页面时显示滚动条。

当我设置“overflow：auto”时，滚动条永远不会弹出，它只是展开页面并删除列表项左侧的扩展图像。

这是示例.html：

<body>
  <div id="theDiv" style="clear: left;">
    <ul id="theList">
      <li id="1" class="parent">
       <img class="expanded" align="absmiddle" src="./tree_expanded.gif"/>
        Parent1
         <ul style="display: block;">
           <li id="10">
           .....
         </ul>
      </li>
      ....
    </ul>
  </div>
</body>

以下是样本.js：

function expand() {
  if(this.className == "expand") {
    jQuery(this.parentNode).children("ul").show();
    this.className = "expanded";
    this.src = "/_images/tree_expanded.gif";
  }
 else {
  jQuery("ul", this.parentNode).hide();
  this.className = "expand";
  this.src = "/_images/tree_unexpanded.gif";
 }
}

这是样本.css：

#theList {
    margin-top: 0;
}

#theList, #theList ul {
    list-style: none;
    margin: 5px 20px;
    padding: 0;
}

#theList .expand, #theList .expanded {
    margin-left: -20px;
    cursor: pointer;
}

#theList img {
    margin-right: 5px;
}

#theList ul {
    display: none;
}

#theList li {
    white-space: nowrap;
    margin-bottom: 4px;
}

Answer 1

首先，设置容器div的确定宽度，以便知道何时开始滚动。接下来，将其设置为overflow-x：scroll;或者那种效果。它应该工作:)）

Answer 2

好的，我在正确的轨道上，但不够坚持。 CSS真的让我疯狂。我需要设置div和列表高度以使其滚动。我正在尝试其中一个，而不是两个。

我是一个n00b。

树菜单不会滚动

2 个答案: