阻止pc端浏览器缩放js代码
众所周知:移动端页面禁止用户缩放界面只需加上即可,但是pc端确实比较麻烦,用户可以通过如下几种方式来缩放:
windows:
ctrl + +/-
ctrl + 滚轮
浏览器菜单栏
mac:
cammond + +/-
浏览器菜单栏
由于浏览器菜单栏属于系统软件权限,没发控制,我们着手解决ctrl/cammond + +/- 或 Windows下ctrl + 滚轮 缩放页面的情况,只能通过js来控制了
下面是用juery和原生js实现的代码:
imgtest测试test测试test测试test测试
/**
* @file 禁止pc浏览器使用ctrl/cammond + +/- 或 Windows下ctrl + 滚轮 缩放页面 (prevent borwser zoom)
* 众所周知:移动端页面禁止用户缩放界面只需要在 即可,但是pc端确实比较麻烦,只能通过js来控制了
* @author yangzongjun
* @date 2017-01-06
*/
/**
代码中event.whick的数字代号的意思:
mac下
chrome:
- 189
+ 187
ff:
- 173
+ 61
然后剩余的两个代号是107、109代表的是数字键盘的+-号
*/
// jqeury version
// $(document).ready(function () {
// // chrome 浏览器直接加上下面这个样式就行了,但是ff不识别
// $('body').css('zoom', 'reset');
// $(document).keydown(function (event) {
// if ((event.ctrlKey === true || event.metaKey === true)
// && (event.which === 61 || event.which === 107
// || event.which === 173 || event.which === 109
// || event.which === 187 || event.which === 189))
// {
// event.preventDefault();
// }
// });
// $(window).bind('mousewheel DOMMouseScroll', function (event) {
// if (event.ctrlKey === true || event.metaKey) {
// event.preventDefault();
// }
// });
// });
// 原生js来实现,避免依赖jquery。需要注意的是:addEventListener/DOMContentLoaded在ie中是只支持>=ie9的,一般足够了
document.addEventListener('DOMContentLoaded', function (event) {
// chrome 浏览器直接加上下面这个样式就行了,但是ff不识别
document.body.style.zoom = 'reset';
document.addEventListener('keydown', function (event) {
if ((event.ctrlKey === true || event.metaKey === true)
&& (event.which === 61 || event.which === 107
|| event.which === 173 || event.which === 109
|| event.which === 187 || event.which === 189))
{
event.preventDefault();
}
}, false);
document.addEventListener('mousewheel DOMMouseScroll', function (event) {
if (event.ctrlKey === true || event.metaKey) {
event.preventDefault();
}
}, false);
}, false);
此次收获:
键盘事件的修饰键(ctrlKey、metaKey)、每个按键的编号
DOMContentLoaded(dom结构渲染完成) 和 Loaded(页面中所有的资源包括图片都渲染完成) 事件的区别
addEventListener 和 DOMContentLoaded 支持 >= ie9,基本无需考虑兼容性
js实现禁止pc端浏览器缩放和获取当前页面浏览器的缩放大小
众所周知:移动端页面禁止用户缩放界面只需加上即可,但 ...
PC端浏览器定位
第一: PC端浏览器定位(纯前端)浏览器定位 :这里用了两种 ,一种是Html5自带的方法 另一种是引用了百度api ,百度api 的使用有三种:1 浏览器定位2 ip定位3 SDK辅助定位引用百度 ...
在thinkPHP3.2.3框架下实现手机和PC端浏览器的切换
查看thinkphp版本号方法 打开文件“根目录\ThinkPHP\ThinkPHP.php”下的文件ThinkPHP.php,在22--23行可以看到版本信息THINK_VERSION,如下图: 说 ...
移动端&;PC端CSS样式兼容代码
CSS样式兼容代码 1.禁止选中复制文本 *{ user-select: none; -moz-user-select: none; -ms-user-select: none; -webkit-us ...
Fiddler4工具配置及调试手机和PC端浏览器
Fiddler最大的用处: 模拟请求.修改请求.手机应用调试 Fiddler最新版本 下载地址: http://www.telerik.com/download/fiddler Fiddler 想要监 ...
浏览器控制台js代码与后台不同步
原因:浏览器会缓存js 如果是将js代码直接通过
window.close(); 关闭浏览器窗口js代码的分析总结
序号 关闭代码 需要确认 无任何作用 无需确认 测试 1 window.close() IE7 firefox,chrome,safari Opera Close 2 window.opener=nu ...
window.close(); 关闭浏览器窗口js代码
序号 关闭代码 需要确认 无任何作用 无需确认 测试 1 window.close() IE7 firefox,chrome,safari Opera Close 2 window.opener=nu ...
IE浏览器部分js代码不生效的问题
[小小坑记录] 问题描述:IE浏览器写好功能代码之后,在调试模式下程序能正常运行.不开启调试模式正常访问时js部分功能代码不生效. 原因:在测试时用了console对象在控制台输出一一些内容,而IE的 ...
随机推荐
Android开发系列(十八):自己定义控件样式在drawable目录下的XML实现
在Android开发的过程中,我们常常须要对控件的样式做一下改变,能够通过用添加背景图片的方式进行改变,可是背景图片放多了肯定会使得APK文件变的非常大. 我们能够用自己定义属性shape来实现. s ...
使用CountDownLatch和CyclicBarrier处理并发线程
闲话不说,首先看一段代码: { IValueCallback remoteCallback = new IValueCallback.Stub() {
#0 scrapy爬虫学习中遇到的坑记录
python 基础学习中对于scrapy的使用遇到了一些问题. 首先进行的是对Amazon.cn的检索结果页进行爬取,很顺利,无碍. 下一个目标是对baidu的搜索结果进行爬取 1,反爬虫 1.1 我 ...
MySQL InnoDB 逻辑存储结构
MySQL InnoDB 逻辑存储结构 从InnoDB存储引擎的逻辑结构看,所有数据都被逻辑地存放在一个空间内,称为表空间,而表空间由段(sengment).区(extent).页(page)组成.p ...
Linux命令学习之路——内容剪切:cut
使用者:所有角色 用法:cut [ -bcdfn ] [ --complement ] filename 作用:截取文件中的部分字段用于展示或存储到新文件中 应用场景: 1.内容展示 : 截取一个或多 ...
[TestNG] Eclipse/STS中两种安装TestNG的方法
Two Ways To Install TestNG in Eclipse/STS Today I install the newest Sprint Tool Suite and want to i ...
day23 模块02
核能来袭--模块 2 1.nametuple() 2.os模块 3.sys模块(重点) 4.序列化 (四个函数) 5.pickle(重点) 6.json(重点中的重点) 1.nametuple() 命 ...
玩转X-CTR100 l STM32F4 l FPU单精度浮点性能测试
我造轮子,你造车,创客一起造起来!塔克创新资讯[塔克社区 www.xtark.cn ][塔克博客 www.cnblogs.com/xtark/ ] 本文介绍X-CTR100控制器如何开启ST ...
最短路 spfa+STL
与迪杰斯特拉相同的是spfa也是用来求单源点的最短路径问题,但是,当问题中的边是有向负边的时候,迪杰斯特拉就无能为力了, 而且给我的感觉是spfa如何结合STL来用的话代码比迪杰斯特拉的还要短一点,只 ...
RewriteCond和13个mod_rewrite应用举例Apache伪静态
1.给子域名加www标记 RewriteCond %{HTTP_HOST} ^([a-z.]+)?example\.com$ [NC] RewriteCond %{HTTP_HOST} !^www\. ...