扫码关注官方订阅号
JavaScript 能不能调用浏览器的缩放功能,就是平时我们按 Ctrl + 鼠标滚轮的效果
JavaScript
Ctrl + 鼠标滚轮
注:因为使用 zoom: x; 和 transform: scale(x); 会有一些小问题(主要是 Firefox 下的),所以会有以上需求。
zoom: x;
transform: scale(x);
Firefox
欢迎选择我的课程,让我们一起见证您的进步~~
应该是只能模拟,document.body.style.zoom = xxx
document.body.style.zoom = xxx
用window.onresize监听变化
window.onresize
<!DOCTYPE html> <html> <head> <title>滑稽</title> <meta charset="UTF-8"> <script src="jquery.min.js"></script> </head> <body> <p id="demo"> 请改变窗口大小</p> </body> <script type="text/javascript"> window.onresize = function(){ document.getElementById("demo").innerHTML="宽度:"+document.documentElement.clientWidth+",高度:"+document.documentElement.clientHeight; } </script> </html>
浏览器好像真没提供这样的接口https://developer.mozilla.org...
其实,想缩放整个页面, 可以尝试用 JS 设置 body 的 transform: scale(); 估计还得计算一下向上的平移量.
http://www.jb51.net/article/2... 监听事件http://blog.csdn.net/huwei200... js页面缩放好像不太好弄,能监听到键盘和鼠标的按键事件,但是滚轮貌似没有监听前滚还是后滚。如果能监听滚动方向就好办了。
.css('transform','scale(.8)');
微信扫码关注PHP中文网服务号
QQ扫码加入技术交流群
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
PHP学习
技术支持
返回顶部
应该是只能模拟,
document.body.style.zoom = xxx用
window.onresize监听变化浏览器好像真没提供这样的接口
https://developer.mozilla.org...
其实,想缩放整个页面, 可以尝试用 JS 设置 body 的 transform: scale(); 估计还得计算一下向上的平移量.
http://www.jb51.net/article/2... 监听事件
http://blog.csdn.net/huwei200... js页面缩放
好像不太好弄,能监听到键盘和鼠标的按键事件,但是滚轮貌似没有监听前滚还是后滚。如果能监听滚动方向就好办了。