如何根据预先确定的文本但可变的页面宽度动态调整文本框的高度
我正在审查一些旧代码,并且有一种方法可以在运行时根据客户端屏幕宽度静态调整文本框控件的高度。因此,如果屏幕分辨率为“1280x800”,则存在硬编码值,那么文本框的高度将为 475px。好吧,我明白了... 不好 几年前,屏幕分辨率和 CRT 显示器数量较少,还算不错,但现在由于多种原因,情况并非如此。
我在 JavaScript 方面做得更好,在 jQuery 方面做得更好一些,我正在寻找一种解决方案,可以根据包含 DIV 的整体宽度调整包含数据库中某些文本的文本框的 高度 大小大小为客户端屏幕宽度的 100%。这意味着较宽的屏幕需要较小的高度,而较宽的屏幕需要较大的高度。
如果可能的话,我想动态地执行此操作。我的最后一招是修复包含控件的宽度,该宽度应指示固定的高度,但我宁愿文本控件跨越整个页面的 100%。
任何建议表示赞赏。谢谢!
I was reviewing some of my old code and I have a method that statically resizes the height of a textbox control at runtime based on the clients screen width. So there were hardocded values if screen resolution is say "1280x800" then the texbox's height is going to be 475px. OK I get it... BAD It was semi-OK a few years ago with the fewer number of screen resolutions and CRT monitors, but not now for a number of reasons.
I have gotten much better with JavaScript and a bit better with jQuery and am looking for a solution that can resize the height of the textbox containing some text from the database based on the overall width of the containing DIV which is sized to 100% of the client's screen width. That means wider screens need a smaller height, and less wide screens need a larger height.
I want to do this dynamically if possible. My last resort is to fix the containing control's width which should dicate a fixed height, but I would rather the text control span the full 100% of the page.
Any suggestions are appreciated. Thanks!
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
这听起来相当于在将文本渲染到显示器之前检索文本指标。我可以想到在 Win Forms 中完成的方法,但在浏览器中...我只能想到在同等大小的 div 中呈现文本(考虑到文本框中的填充)并获取渲染的大小,删除 div (您可以在页面加载时以某种不可见的方式执行此操作)并将结果应用到文本框。
That sounds like the equivalent of retrieving the text metrics before you render it to the display. I can think of ways that is done in Win Forms but in the browser... I could only think of presenting the text in an equivalently sized div (taking into account the padding in the textbox) and grabbing the rendered size, removing the div (you could do this somewhat invisibly as the page loaded) and applying the results to your textbox.