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

问题描述：

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

文本字段：

<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; 
}

答

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

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

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

我设置溢出：汽车上的文本框，并取得了文本框大小相同的股利。

另外我不相信在label里面有div是有效的，浏览器会渲染它，但它可能会导致一些时髦的事情发生。您的div也未关闭。

当我们使用-webkit-scrollbar psuedo元素自定义滚动条时，如何使这个解决方案正常工作。？因为如果溢出是自动psuedo元素arent工作....我想定制我的滚动条以及隐藏然后不需要时？ – Kpatel1989 2015-04-27 08:37:51

答

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

正如我在我的问题上溢说：汽车;不起作用:( – Lukus 2012-03-05 00:47:51

隐藏？ – 2012-03-05 00:49:17

隐藏隐藏滚动条，但一旦文本通过div它不显示滚动条，所以不能向下滚动查看文本的其余部分 – Lukus 2012-03-05 00:51:30

答

添加这个类中的.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> <p class = "scrol" id = "title">-</p></div>

我附上图片，你看到了把上面的代码的 enter image description here

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

相关推荐