项目遇到一个问题，在web页面中，禁止长按图片保存，

使用css属性：

 img { pointer-events: none; }
或者

 img { -webkit-user-select: none; }
无效，
以上属性在浏览器中是可以实现长按不能保存的，
接下来思考到既然要让图片不能触发手机自带的长按保存事件，需要让图片失去焦点，
如何失去焦点呢，其实很简单，只要在图片上遮一层盒子就行啦~
 
上代码：
<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

        <style>

            .box{

                width: 400px;

                height: 400px;

                border: 2px solid salmon;

                position: relative;

            }

            .wrap{

                width: 400px;

                height: 400px;

                position: absolute;

                opacity: 0.5;

                top: ;

                left: ;

                right: ;

                bottom: ;

                margin: auto;

                background-color: darkslateblue;

                z-index: ;

            }

            img{

                width: 400px;

                height: 400px;

            }

        </style>

    </head>

    <body>

        <div class="box">

            <div class="wrap"></div><!--遮罩盒子-->

            <img src="img/1.jpg" />

        </div>

    </body>

</html>

这样就能在APP上禁止长按图片保存到本地了

微信APP长按图片禁止保存到本地的更多相关文章

  1. 微信小程序生成分享图片，保存到本地

    1.页面 <canvas canvas-id="shareCanvas" style="width:600px;height:900px">< ...

  2. iOS UIWebview 长按图片，保存到本地相册

    我们所要解决的问题如题目所示:ios中,长按Webview中的图片,将图片保存到本地相册.解决方案:对load的html网页,执行js注入,通过在webview中执行js代码,来响应点击事件,通过js ...

  3. php获取网页中图片并保存到本地

    php获取网页中图片并保存到本地的代码,将网页中图片保存本地文件夹: save_img("http://www.jbxue.com" ?>

  4. php获取网页中图片并保存到本地的代码

    php获取网页中图片并保存到本地的代码,将网页中图片保存本地文件夹: <?php /** * 获取网页中图片,并保存至本地 * by www.jbxue.com */ header(" ...

  5. 下载远程（第三方服务器）文件、图片，保存到本地（服务器）的方法、保存抓取远程文件、图片 将图片的二进制字节字符串在HTML页面以图片形式输出 asp.net 文件 操作方法

    下载远程(第三方服务器)文件.图片,保存到本地(服务器)的方法.保存抓取远程文件.图片   将一台服务器的文件.图片,保存(下载)到另外一台服务器进行保存的方法: 1 #region 图片下载 2 3 ...

  6. 使用URLConnection下载文件或图片并保存到本地

    有时候需要从网络上面下载图片到本地进行保存,代码如下: package com.jointsky.jointframe.test; import java.io.FileOutputStream; i ...

  7. python爬取某个网站的图片并保存到本地

    python爬取某个网站的图片并保存到本地 #coding:utf- import urllib import re import sys reload(sys) sys.setdefaultenco ...

  8. Python：爬取网站图片并保存至本地

    Python:爬取网页图片并保存至本地 python3爬取网页中的图片到本地的过程如下: 1.爬取网页 2.获取图片地址 3.爬取图片内容并保存到本地 实例:爬取百度贴吧首页图片. 代码如下: imp ...

  9. 编辑美化图片，保存至本地，Adobe出品（支持IOS，android，web调用）免费插件

    本例以web调用做为例子,本插件支持主流浏览器,IE要9以上,移动设备,触屏设备也支持,能自适应屏幕大小. 使用效果: 工具还是很丰富的,编辑完成之后,可以保存图片至本地目录. 使用说明: 1,需要在 ...

随机推荐

  1. Error Code: 1360 - Trigger does not existQuery

    1.错误描述 Query: DROP TRIGGER `t_sert_cs_approve` Error occured at:2015-04-12 13:37:32 Line no.:1 Error ...

  2. 笔记：promise实例+注释

    ////////////////////////////////////////////// var data = [1,2,3,4]; var promise = new Promise((reso ...

  3. POI 的API大全二

    1.POI结构与常用类 (1)POI介绍 Apache POI是Apache软件基金会的开源项目,POI提供API给Java程序对Microsoft Office格式档案读和写的功能. .NET的开发 ...

  4. 反射（C#编程）

    反射提供了封装程序集.模块和类型的对象(Type 类型).可以使用反射动态创建类型的实例,将类型绑定到现有对象,或从现有对象获取类型并调用其方法或访问其字段和属性.如果代码中使用了属性,可以利用反射对 ...

  5. 学习一之UML类图

    前言 最近在学习程杰老师的<大话设计模式>,觉得非常不错,就做了一些学习笔记和总结.如果对设计模式很感兴趣的,可以直接阅读书籍,相信会有更多的收获. 本人小菜一枚,如果理解的不对的还请多多 ...

  6. RobotFramework自动化测试框架的基础关键字（三）

    1.1.1        如何定义一个字典 此处我们说的字典,其实就等同于python语言中的字典,和列表一样,字典也是python语言中非常常用的一种数据结构,也类似于Java 语言中的Map. 在 ...

  7. 描述一下Spring框架的作用和优点？

    Spring框架的作用和优点如下: 1.Spring是一个开源的轻量级的应用开发框架,其目的是用于简化企业级应用程序开发,减少侵入: 2.Spring提供的IOC和AOP应用,可以将组建的耦合度降低至 ...

  8. 【CF235C】Cyclical Quest（后缀自动机）

    [CF235C]Cyclical Quest(后缀自动机) 题面 洛谷 题解 大致翻译: 给定一个串 然后若干组询问 每次也给定一个串 这个串可以旋转(就是把最后一位丢到最前面这样子) 问这个串以及其 ...

  9. Marriage Match IV HDU - 3416

    题意 给你n个点,m条边,要求每条边只能走一次的S到T的最短路径的个数 题解 在我又WA又TLE还RE时,yyb大佬告诉我说要跑两遍SPFA,还说我写的一遍SPFA是错的,然而 啪啪打脸... 而且他 ...

  10. 【xsy2140】计数

    Time Limit: 1000 ms Memory Limit: 256 MB description 吐槽 所以说..组合数的题是不是都是知道大致思路但是就是不会写qwq菜醒qwq 正题 这题其实 ...