导航:首页 > 编程语言 > js禁止页面放大缩小

js禁止页面放大缩小

发布时间:2023-08-06 08:55:30

js怎么禁止浏览器窗口缩放

简单的回答是:不能


从用户角度讲,这是他们应有的权利,它属于操作系统中应用软件的一部分,并不属于页面,你没有办法禁止用户对窗口进行缩放。


有一个办法可以保证页面总是保持在你想要的尺寸:resizeTo


IE和Safari暂时还都支持在当前页面使用resizeTo,其它浏览器都已经改为只支持在window.open打开的页面上使用。所以要兼容全部浏览器,你的页面必须使用window.open打开,并且在部分浏览器中要设置width和height属性(否则窗口会在TAB中打开)。


index.html

<script type="text/javascript">
/* 或者在适当的情况使用 a onclick 调用 window.open */
window.open("w.html", "", "top=0,left=0,toolbar=1,menubar=1,"
+ "width=" + screen.width + ",height=" + screen.height);
</script>

main.html

<script type="text/javascript">
window.onresize = function() {
var window_width = window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;

if(window_width < 1000) {
// 部分浏览器需要延迟
setTimeout(function() {
// 窗口最大化
window.resizeTo(screen.width, screen.height);
// 窗口移动至 top=0, left=0
window.moveTo(0, 0);
}, 100);
}
};
</script>

注意即使在window.open和window.resizeTo中使用了screen.width和screen.height,但打开的窗口并不是我们平时看到的最大化,窗口离屏幕四周会有一定距离。


使用这种方法最大的问题就是会令访问者产生反感,因为你强迫用户使用指定尺寸的窗口大小。但这也是现在唯一的方法。


所以个人还是建议你当窗口过小的时候,mask掉整个页面,给用户一个提示,例如:您的浏览器窗口尺寸过小,为了正常访问此页面,请调整窗口尺寸。

② js:window.open()设置新打开的页面的大小不可改变的问题

  1. window.onload = function(){

    window.resizeTo(800,600);//调整大小

    window.moveTo(200,200);//移动位置}

  2. 但是这种方式好像只有在IE下有效,Firefox和Chrome无效,你自己试试。暂时不知道有什么其他兼容性好的办法。

③ JS控制浏览器网页内容的百分比缩放

你可以让顶部导航栏和其他部分分处不同的层,然后你只需要对其他部分版所处的层进行缩权放处理,导航栏不动,这样就实现你的目的了。比如:
<div class=head>这是顶部导航栏</div>
<div class=body>这是其他主体部分</div>
然后js代码就可以这样:
$("div.body").css({"transform":"scale(0.8)","transform-origin":"50% 0"})

④ 如何用JS或者Jquery,禁用当前页面的缩放。

window.addEventListener('mousewheel', function(event){
if (event.ctrlKey === true || event.metaKey) {
event.preventDefault();
}
},{ passive: false});
//firefox
window.addEventListener('DOMMouseScroll', function(event){
if (event.ctrlKey === true || event.metaKey) {
event.preventDefault();
}
},{ passive: false});

阅读全文

与js禁止页面放大缩小相关的资料

热点内容
文件夹选项没有文件类型 浏览:566
一加传入的文件找不到 浏览:478
使用动态存储分配编写完整的程序 浏览:359
com与vb6分布式应用程序设计 浏览:939
系统分页文件可以缩小吗 浏览:791
音乐网站设计源码 浏览:363
javamail服务器 浏览:853
如何把手机数据变快 浏览:589
angularjs2时间 浏览:920
下载临时文件夹找不到 浏览:592
施乐cm215固件升级 浏览:688
word2010页码左右设置 浏览:907
tpg文件 浏览:517
edusoho安装教程 浏览:251
编程猫如何申请退课 浏览:794
红米怎么用文件管理下载qq视频 浏览:560
自己要解压的文件找不到怎么办 浏览:296
文件管理的图片可以搜回来吗 浏览:369
mini下载的文件在哪里 浏览:973
mfrc522射频识别参考程序注释new 浏览:363

友情链接