如何获取“Ctrl”使用 Javascript 在浏览器上的行为?
我在 47 英寸液晶电视(分辨率 1920 * 1080,16:9)上打开 Stack Overflow 网站,发现文本和网站就在大量空白的中间。该文本无法阅读,因为 Stack Overflow 与许多其他网站一样,针对标准 1200/1024 视口进行了优化。
为了使网站可读,我按下“ctrl”和“+”键,让内容占据更多的屏幕宽度。我确信这不是“放大”,因为浏览器实际上所做的是放大内容大小(即减少每个字符的像素数)。
在检测视口的分辨率/大小参数后,可以使用 Javascript 作为预渲染练习来实现这种“ctrl +”行为吗?
更新:我尝试了@media-queries,它可以缩放字体大小和其他一些东西,但它无助于以平衡的方式缩放图像和其余内容(例如填充等) 。最重要的是,它不满足将给定 div 的大小限制为“610 像素但占据可用屏幕宽度的 75%”的条件。
这就像在基于 Gecko/Webkit 的浏览器上按 ctrl + 改变分辨率一样。抱歉,无法接受下面的答案。
I opened the Stack Overflow website on my 47 inch LCD TV (resolution 1920 * 1080, 16:9) and found the text and website right in the middle of a lot of whitespace. The text was unreadable because Stack Overflow, like many other websites, is optimized for standard 1200/1024 viewports.
In order to make the website readable, I pressed 'ctrl' and '+' keys and sort of got the content to occupy more screen width. I am sure this is not "zoom in" because what the browser is actually doing is scale up the content size (i.e. reduces the no. of pixels per character).
Can this 'ctrl +' behavior be achieved using Javascript as a pre-render exercise after detecting the resolution/size parameter of the viewport?
Update: I tried @media-queries which scales font-sizes and other few things, but it doesn't help to scale images and rest of the content (such as padding etc.) in a balanced way. Most importantly, it doesn't satisfy the condition to restrict the size of a given div to say "610px and yet occupy 75%" of the available screen-width.
Which is like a resolution change if we press ctrl + on Gecko/Webkit based browsers. Sorry can't accept the answer below.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
大多数情况下是的。
IE6,7有
缩放
,IE8有-ms-zoom
其他人都有 2D 变换和
scale()
,所以您也可以。请参阅 zoom css/javascript我还没有看到有人将这种效果应用于整个文档,所以事情可能是越野车。享受!
Mostly yes.
IE6,7 have
zoom
and IE8 has-ms-zoom
Everyone else has 2D transforms and
scale()
so you're covered. see zoom css/javascriptI havent seen anyone apply this sort of effect to the entire document, so things might be buggy. Enjoy!
我确信使用 javascript 是可能的,就像大多数事情似乎一样,但我认为这正是 CSS 媒体查询 是专门为了解决这个问题而设计的。
查看A List Apart 的响应式网页设计文章
I'm sure it's possible with javascript, as most things seem to be, but I think that this is the exact kind of problem that CSS Media Queries were specifically designed to solve.
Check out the article on Responsive Web Design over at A List Apart