-
canvas画布实现手写签名效果的示例代码
所属栏目:[MySql教程] 日期:2020-03-28 热度:77
最近项目中涉及到移动端手写签名的功能需求,将实现代码记录于此,供小伙伴们参考指摘哦~ HTML代码: !--手写区--div class=mSign_signMark_boxdiv class=mSign_signMark_write_boxdiv id=mSign_signMark_signature_pad class=mSign_signMark_body_boxdiv[详细]
-
html5中监听canvas内部元素点击事件的三种方法
所属栏目:[MySql教程] 日期:2020-03-28 热度:200
canvas内部元素不能像DOM元素一样方便的添加交互事件监听,因为canvas内不存在元素这个概念,他们仅仅是canvas绘制出来的图形。这对于交互开发来说是一个必经障碍,想要监听图形的点击事件思路很简单,只要监听canvas元素本身的点击事件,再判断点击坐标位[详细]
-
Html5实现单张、多张图片上传功能
所属栏目:[MySql教程] 日期:2020-03-28 热度:118
副标题#e# 今天我们聊一聊图片上传,单张Or多张 ,如今,各大图片上传插件数不胜数,例如:Jquery的 verupload.js,jQuery File Upload、Uploadify、jQuery.filter等等。But。上面说到的这些插件,今天我们不谈,我们来看一看使用HTML5中的FileReader 如何[详细]
-
鲜为人知的HTML5语音合成功能
所属栏目:[MySql教程] 日期:2020-03-28 热度:85
听一下就会发现,播放出来的声音并不是预先录制好的音频资料,而是通过文字识别后合成的语音 请先戴上耳机,然后将下面的代码复制到chrome控制台中体验~ let msg = new SpeechSynthesisUtterance(欢迎你阅读我的博客);window.speechSynthesis.speak(msg);[详细]
-
HTML利用九宫格原理进行网页布局
所属栏目:[MySql教程] 日期:2020-03-28 热度:170
说到九宫格是不是想到了九宫格火锅那(O(_)O哈哈~)。其实九宫格布局在各大网站基本都有应用,当然这里的九宫格是泛指(O(_)O哈哈)。比如小米商城局部布局如下: 不难发现,一些电商平台的布局基本上大同小异,最普遍的还是这种九宫格布局。当然通过CSS也[详细]
-
HTML5 图片预加载的示例代码
所属栏目:[MySql教程] 日期:2020-03-28 热度:60
在HTML5中,我们可以使用drawImage方法在canvas上进行画图操作,其基本代码如下: var canvas = document.getElementById(canvas);var context = canvas.getContext(2d);var image = new Image();image.src = images/01.jpg;context.drawImage(image, 0, 0[详细]
-
HTML5 Canvas实现放大镜效果示例
所属栏目:[MySql教程] 日期:2020-03-28 热度:122
副标题#e# 在线源码预览 源码 原理 首先选择图片的一块区域,然后将这块区域放大,然后再绘制到原先的图片上,保证两块区域的中心点一致, 如下图所示: 初始化 canvas id=canvas width=500 height=500/canvasimg src=http://www.jb51.net/html5/image.png st[详细]
-
html2canvas截图空白问题的解决
所属栏目:[MySql教程] 日期:2020-03-28 热度:148
最近在项目中遇到一个需求,需要提供网页截图的功能。百度下发现html2canvas很好用。那就试试吧。 资源下载地址 插件下载地址:html2canvas下载地址 使用方式 项目使用的react组件开发方式。参照官方的说明文档getting-started.md,按照以下步骤进行: 1、[详细]
-
html5 移动端视频video的android兼容(去除播放控件、全屏)
所属栏目:[MySql教程] 日期:2020-03-28 热度:164
副标题#e# android下html5的视频播放一直是前端兼容的重灾区,各种体验差,被诟病已久。但之前的故宫穿越H5,和吴亦凡入伍H5,利用的视频技术,貌似又给人一种新面貌。 前段时间做某项目,恰好也是一个类似视频全屏的,下面跟大家分享下经历的坑和填坑的办[详细]
-
html通过canvas转成base64的方法
所属栏目:[MySql教程] 日期:2020-03-28 热度:171
在H5的营销活动中,经常生成一张图片让用户分享或者保存,这时候处理方案有两种。 一种是让后端生成图片,返回一个图片地址给前端展示 一种是前端自主合并生成图片展示,文中主要说明这个方案 demo !--生成后存放的IMG--img src=http://www.jb51.net/html5[详细]
-
解决H5的a标签的download属性下载service上的文件出现跨域问题
所属栏目:[MySql教程] 日期:2020-03-28 热度:61
1.通过点击下载多媒体文件(图片/视频/文件等) 最简单的方式: a href='http://www.jb51.net/html5/url' download=filename.ext下载文件/a 如果url指向同源资源,是正常的。 如果url指向第三方资源,download会失效,表现和不使用download时一致浏览器能打[详细]
-
Html5页面上如何禁止手机虚拟键盘弹出
所属栏目:[MySql教程] 日期:2020-03-28 热度:151
工作中遇到如下需求,点击输入框弹出自定义弹窗,输入框是input标签: 但是在移动端,input会默认触发手机的虚拟键盘,如何阻止手机虚拟键盘弹起呢?目前我试过有两个方案,一个是给input添加readonly属性,另一个就是在input事件处理方法前面添加一句docum[详细]
-
canvas实现手机的手势解锁的步骤详细
所属栏目:[MySql教程] 日期:2020-03-28 热度:107
副标题#e# 按照国际惯例,先放效果图 1、js动态初始化Dom结构 首先在index.html中添加基本样式 body{background:pink;text-align: center;} 加个移动端meta头 meta name=viewport content=width=device-width,initial-scale=1.0,user-scalable=no 引入index[详细]
-
Html+Css+Jquery实现左侧滑动拉伸导航菜单栏的示例代码
所属栏目:[MySql教程] 日期:2020-03-28 热度:107
移动端 代码 !DOCTYPE htmlhtmlheadtitle左侧导航/titlemeta charset=utf-8script src=http://www.jb51.net/html5/https:/cdn.staticfile.org/jquery/1.10.2/jquery.min.js/scriptmeta name=viewport content=width=device-width,initial-scale=1.0,maximu[详细]
-
最适合新手的Redis基础
所属栏目:[MySql教程] 日期:2020-03-25 热度:111
副标题#e# 我们先看看Redis官网给的介绍: Redis is an open source (BSD licensed), in-memory data structure store, used as a database, cache and message broker. It supports data structures such as strings, hashes, lists, sets, sorted sets wi[详细]
-
因为没有网关,我的服务器被DDoS了
所属栏目:[MySql教程] 日期:2020-03-20 热度:182
副标题#e# 【金融特辑】光大****科技部DBA女神带你从0到1揭秘MGR 大家好,我是鸭血粉丝,想起来之前生产发生的事故,阿粉我的内心到现在都还很忐忑不安,今天我们来学习一个 Kong 以及跟你们聊聊做好网关限流控制的重要性。 背景 事情是这样的,阿粉记得那[详细]
-
为什么Zookeeper天生就是一副分布式锁的胚子?
所属栏目:[MySql教程] 日期:2020-03-19 热度:176
副标题#e# 【金融特辑】光大****科技部DBA女神带你从0到1揭秘MGR 什么是分布式锁?分布式锁是控制分布式系统之间同步访问共享资源的一种方式。在分布式系统中,常常需要协调他们的动作。 图片来自 Pexels 如果不同的系统或是同一个系统的不同主机之间共享了[详细]
-
html5本地存储_动力节点Java学院整理
所属栏目:[MySql教程] 日期:2020-03-18 热度:116
Web Storage是HTML5引入的一个非常重要的功能,可以在客户端本地存储数据,类似HTML4的cookie,但可实现功能要比cookie强大的多,cookie大小被限制在4KB,Web Storage官方建议为每个网站5MB。 Web Storage又分为两种: sessionStorage localStorage 从字面[详细]
-
利用Canvas模仿百度贴吧客户端loading小球的方法示例
所属栏目:[MySql教程] 日期:2020-03-17 热度:66
最近看到两个好玩的 demo,效果图如下: 今天趁着周末有空,用 H5 的 Canvas 仿了一下。这篇文章只实现第一个效果图。 这是我实现的效果: 实现原理 实现原理是参考简书的那篇文章,这里不再复述。现在我们来一步一步实现这样的效果。 第零步:画一个圆 源[详细]
-
HTML5之web workers_动力节点Java学院整理
所属栏目:[MySql教程] 日期:2020-03-17 热度:52
副标题#e# 专用 Web Worker (Dedicated Web Worker) 提供了一个简单的方法使得 web 内容能够在后台运行脚本。一旦 worker 创建后,它可以向由它的创建者指定的事件监听函数传递消息,这样该 worker 生成的所有任务就都会接收到这些消息。worker 线程能够在[详细]
-
Html5之svg可缩放矢量图形_动力节点Java学院整理
所属栏目:[MySql教程] 日期:2020-03-17 热度:151
副标题#e# SVG可缩放矢量图形(Scalable Vector Graphics)是基于可扩展标记语言(XML),用于描述二维矢量图形的一种图形格式。SVG是W3C制定的一种新的二维矢量图形格式,也是规范中的网络矢量图形标准。SVG严格遵从XML语法,并用文本格式的描述性语言来描[详细]
-
详解HTML5通讯录获取指定多个人的信息
所属栏目:[MySql教程] 日期:2020-03-17 热度:107
一、获取多个人的信息:要解决通讯录导入多个人的信息之前,要解决获取多个人的信息。我通过plus.contacts.getAddressBook和address.find的套用把通讯录里面的所有联系人的id和displayName获取出来,然后通过自己写的通讯录获取页面显示出来。 1、解决这个[详细]
-
如何开发一款堪比APP的微信小程序(腾讯内部团队分享)
所属栏目:[MySql教程] 日期:2020-03-17 热度:180
一夜之间,微信小程序刷爆了行业网站和朋友圈,小程序真的能如张小龙所说让用户即用即走吗? 其功能能和动辄几十兆安装文件的APP相比吗? 开发小程序,是不是意味着移动应用开发的一次推倒重来,企业的运营成本会不会因此增加? 近日,笔者参加了一次腾讯[详细]
-
详解HTML5 LocalStorage 本地存储
所属栏目:[MySql教程] 日期:2020-03-17 热度:137
副标题#e# HTML5 storage提供了一种方式让网站能够把信息存储到你本地的计算机上,并再以后需要的时候进行获[详细]
-
HTML5应用之文件上传
所属栏目:[MySql教程] 日期:2020-03-17 热度:77
副标题#e# 长期以来,开发者们一直为此苦恼,大部分为解决这个问题都采用了flash作为解决方案,但flash并非灵丹妙药,因为flash版本,割据造成的问题有时反倒成为了噩梦。有些网站则采用了form标签的enctype=multipart/form-data属性,但这一属性要求服务器[详细]