想要从文本区域中移除滚动条？

Question

想要从文本区域中移除滚动条？

4

我创建了一个文本区域，希望当我的文本超出文本区域的宽度时，不要创建滚动条，而是应该增加文本区域的宽度。我该怎么做呢？以下是我应用的HTML代码和CSS，请为我提供建议。我正在尝试让这个文本区域像Facebook的评论框那样工作。

<style>
.textarticle
 {
  box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.18);
  width:600px;
  max-width:600px;
  min-height: 50px;
  max-height: 140px;
  border:1px solid E7DBDB;
  border-radius:5px;
  overflow:none;
 }
</style>

<html>
 <textarea class="textarticle" name="textarticl" placeholder="Enter Article">
</html>

- Ayyan Alvi

3

应使用"overflow:hidden"，而非"overflow:none"。 - Josh Crozier

@JoshCrozier，我尝试了这个方法，但它只移除了滚动条，并没有增加高度。 - Ayyan Alvi

我正在尝试让这个文本区域像Facebook评论框一样工作。 - Ayyan Alvi

3个回答

2

@JoshCrozier是正确的，你需要使用overflow:hidden。为了让文本区域自动扩展高度，你需要一个来自JQuery插件的小帮助。一个有用的插件是Jack Moore的autosize.js。

只需调用$('textarea').autosize();，然后你就可以开始了。

这里有一个jsFiddle来演示它。

- symlink

0

隐藏滚动条而不影响滚动，我认为这是预期行为: https://blog.logrocket.com/hide-scrollbar-without-impacting-scrolling-css

例如：

body::-webkit-scrollbar{
 display: none;
}
textarea::-webkit-scrollbar{
 display: none;
}

- Patrick

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Sagar Awasthi · Accepted Answer

Add overflow:auto

textarea { overflow: auto; }