由于之前几乎没有使用过canvas;今天遇到了一个很棘手的问题。canvas生成后,然后长按保存到手机。

正常的流程应该是先用canvas进行画图,然后再把canvas转成地址,最后再把转化的地址给img标签,这样就可以进行保存了

大家都知道,在手上访问H5页面的时候,长按图片就会把图片保存起来。(哭瞎~~我之前不知道,一直想把canvas直接长按保存;各种问度娘。好在知道了。)

话不多说了,上代码片段

html

js

初学者,有什么不对的地方,还请各位大佬多多指点一下

h5页面长按保存图片的更多相关文章

  1. H5页面长按导致app崩溃问题解决

    每天学习一点点 编程PDF电子书.视频教程免费下载:http://www.shitanlife.com/code 最近用H5页面做了个安卓的项目,但是在H5页面中长按文字内容,会导致APP崩溃掉... ...

  2. H5页面长按复制功能实现

    手机赚钱怎么赚,给大家推荐一个手机赚钱APP汇总平台:手指乐(http://www.szhile.com/),辛苦搬砖之余用闲余时间动动手指,就可以日赚数百元 默认情况下禁止了长按复制功能,要此功能需 ...

  3. 关于ios在H5页面长按识别二维码无效

    环境 框架: vue 操作系统: ios 解决 如果你的vue-router用了mode:history: 把它去掉用默认的就OK了

  4. 移动端H5页面禁止长按复制和去掉点击时高亮

    /*设置IOS页面长按不可复制粘贴,但是IOS上出现input.textarea不能输入,因此将使用-webkit-user-select:auto;*/ *{ -webkit-touch-callo ...

  5. 关于H5页面中生成图片的两种方式!

    前言: 我们在做项目过程中,经常会遇到自定义生成一张图片并可以长按保存.长按保存图片在微信等浏览器中默认就有,那么对于生成图片的有哪些方式呢? 方法一: 利用canvas绘制图形,然后生成图片 代码如 ...

  6. 那些过目不忘的H5页面

    原文链接:http://isux.tencent.com/great-mobile-h5-pages.html 从引爆朋友圈的H5小游戏<围住神经猫>,到颠覆传统广告的大众点评H5专题页& ...

  7. 【干货】微信场景之H5页面制作免费工具大集合

    营销代有手段出,各领风骚数百天.要说现在哪些营销方式最能传播,屡屡刷爆朋友圈的H5页面肯定就是首当其冲的,提到H5页面,就立马想到"围住神经猫",上线微信朋友圈3天的时间便创造了用 ...

  8. 移动端H5页面的设计稿尺寸大小规范-转载自http://www.chinaz.com/design/2015/1103/465670.shtml

    机屏幕尺寸,设计稿应该按照哪一个尺寸作为标准尺寸.现在已经有2K分辨率的手机屏幕了,设计稿是不是也要把宽高跟着最大分辨率来设计.显然不是. 请注意:(以下所有讨论内容和规范均将viewport设定为c ...

  9. 使用Flexible实现手淘H5页面的终端适配【转】

    曾几何时为了兼容IE低版本浏览器而头痛,以为到Mobile时代可以跟这些麻烦说拜拜.可没想到到了移动时代,为了处理各终端的适配而乱了手脚.对于混迹各社区的偶,时常发现大家拿手机淘宝的H5页面做讨论—— ...

随机推荐

  1. jQuery通过地址获取经纬度demo

    在开始之前,首先需要登录百度地图API控制台申请密钥ak. 1.登录百度地图开放平台http://lbsyun.baidu.com 注册账号,完善信息,点击网站右上角的“API控制台”,点击,创建应用 ...

  2. yispider 开源小说採集器 (来源http://git.oschina.net/yispider/yispider 我的改动版由于他的我无法跑)

    我的git地址  http://git.oschina.net/yangdc/yispider 小说採集器 watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/ ...

  3. 第五课 Struts的控制器【续】Action类的execute()方法

    1.Action类的execute()方法: public ActionForward execute(ActionMapping mapping,                           ...

  4. 在mac上安装gradle(超详细,直接按步骤操作即可轻松搞定)

    第一步, 就是先download最新版本的gradle,网址如下: http://gradle.org/gradle-download/ 然后将下载下来的zip包放解压到本地任意的路径上, 例如,我本 ...

  5. 【Codevs 1376】帕秋莉•诺蕾姬

    http://codevs.cn/problem/1376/ 枚举修改哪两位,将sum减去之前位置的数+交换之后  %m==0即可 预处理26的次方+O(n^2) // <1376.cpp> ...

  6. 洛谷 P1573 栈的操作

    题目描述 现在有四个栈,其中前三个为空,第四个栈从栈顶到栈底分别为1,2,3,-,n.每一个栈只支持一种操作:弹出并压入.它指的是把其中一个栈A的栈顶元素x弹出,并马上压入任意一个栈B中.但是这样的操 ...

  7. 第十四周 Leetcode 315. Count of Smaller Numbers After Self(HARD) 主席树

    Leetcode315 题意很简单,给定一个序列,求每一个数的右边有多少小于它的数. O(n^2)的算法是显而易见的. 用普通的线段树可以优化到O(nlogn) 我们可以直接套用主席树的模板. 主席树 ...

  8. POJ2686 Traveling by Stagecoach 状态压缩DP

    POJ2686 比较简单的 状态压缩DP 注意DP方程转移时,新的状态必然数值上小于当前状态,故最外层循环为状态从大到小即可. #include <cstdio> #include < ...

  9. SPOJ OTOCI 动态树 LCT

    SPOJ OTOCI 裸的动态树问题. 回顾一下我们对树的认识. 最初,它是一个连通的无向的无环的图,然后我们发现由一个根出发进行BFS 会出现层次分明的树状图形. 然后根据树的递归和层次性质,我们得 ...

  10. bzoj 1635: [Usaco2007 Jan]Tallest Cow 最高的牛【差分】

    s[i]为差分后的"i这头牛前有几头比它高",计算答案的时候加成前缀和,假设第一头最高减一下即可 用map记录一下被加过的区间,避免重复 #include<iostream& ...