不需要时如何隐藏垂直滚动条

Question

我有一个文本区域，它包含在一个 div 中，因为我有 jquery 提示并且想在不更改边框的情况下使用不透明度。 有一个可见的垂直滚动条，我只希望在我输入文本字段时显示它并且它超出了容器。我试过溢出：自动；但不起作用。

文本字段：

<label>
    <div id="name">
        <textarea name="message" type="text" id="message"
            title="Enter Message Here"
            rows=9 cols=60 maxlength="2000"></textarea>
    </div>
</label>

样式：

#name { 
    border: 1px solid #c810ca;
    width: 270px;
    height:159px;
    overflow: hidden; 
    position: relative;
    }

#message {
    height: 400px;
    width: 235px;
    overflow: hidden;
    position: absolute;
}

Answer 1

在 .css 类中添加这个类

.scrol  { 
font: bold 14px Arial; 
border:1px solid black; 
width:100% ; 
color:#616D7E; 
height:20px; 
overflow:scroll; 
overflow-y:scroll;
overflow-x:hidden;
}

并使用 div 中的类。喜欢这里。

<div> <p class = "scrol" id = "title">-</p></div>

我附上了图片，你看到上面代码的输出

Answer 2

overflow: auto（或overflow-y: auto）是正确的方法。

问题是您的文本区域比您的 div 高。 div 最终切断了文本框，所以即使它看起来应该在文本高于 159px 时开始滚动，它也不会开始滚动，直到文本高于 400px 这是文本框的高度.

试试这个：http://jsfiddle.net/G9rfq/1/

我在文本框上设置了overflow:auto，并使文本框和div大小一样。

另外，我认为在div 中包含div 是无效的，浏览器会呈现它，但它可能会导致一些奇怪的事情发生。你的div 也没有关闭。

Answer 3

我认为overflow: auto; 或overflow: hidden; 应该这样做。