首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >如何防止文本区域在键入和运行页面底部时跳舞?:JQuery/CSS

如何防止文本区域在键入和运行页面底部时跳舞?:JQuery/CSS
EN

Stack Overflow用户
提问于 2016-04-19 05:17:18
回答 1查看 197关注 0票数 5

我不断地输入自动大小大小的文本区域;

当文字进入页面底部,我继续打字;

我发现,页面就像地狱一样在每个按键或键盘和文本上运行到页面底部(我需要向下滚动,以检查正在发生的事情)。如何防止页面跳舞和文字跑到底部?

JS Fiddle:https://jsfiddle.net/osbnnbxa/

Browser: IE10 (在火狐中也很少跳舞;但是客户端使用IE10,所以只需要在这方面工作)

HTML:

代码语言:javascript
复制
<div>
 <div>
  <br><br> &nbsp;&nbsp;
    <textarea class="normal" name="myarea" id="myarea" style="height: 100px; overflow-y: hidden;"></textarea>
  </div>
</div> 
<input type="button" class="butt" value="ehehehhe" />

JQuery:

代码语言:javascript
复制
var myquery = {
  autoHeight: function(e) {
  $(e).css({
  'height': 'auto',
  'overflow-y': 'hidden'
 }).height(e.scrollHeight);
},
init: function() {
setTimeout(function() {
  $('textarea').each(function() {
    myquery.autoHeight(this);
  }).on('input', function() {
    myquery.autoHeight(this);
  });
}, 200);
$("textarea").keypress(function(e) {
   $(".butt").focus();    
   $(this).focus();    
});
  }

};

$(myquery.init);

更新:客户说不要定义文本区域的最大高度。让它随着文本的增加而流动。

EN

回答 1

Stack Overflow用户

发布于 2016-04-19 05:28:38

好吧,我知道你说让文本区域流动,但我真的很喜欢这个解决方案。在你的小提琴,它让文本区域增长到接近底部的视口,并停止所有的舞蹈。希望这是个合理的妥协。改良小提琴为这里

代码语言:javascript
复制
textarea {
  max-height: 85vh;
}
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/36709171

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档