Mr. Ma 发布的文章

Mr. Ma

Canvas 实现照片涂鸦

canvas 是 HTML5 中的一个元素,它能用来绘制各种图形、文字,目前前端的很多图表库也会用到 canvas 来绘制。canvas 除了绘制图形外,也能用来处理照片,我用过的一个图片压缩库也是用 canvas 实现的。我之前写过 使用 canvas...

JavaScript 常用日期时间函数片段

PHP 提供了很多日期时间函数,可以很方便的操作日期时间。JavaScript 也提供了 Date 对象来操作日期时间,但相比 PHP 来说,还是要麻烦一些,很多功能只能自己编写实现。下面是我项目中用过的一些操作日期时间的代码片段,这里把它封装成函数,方...

Typecho 主题开发 - 图片懒加载

图片懒加载,也可以称为延迟加载。简单来说就是默认只加载可视区内的图片,可视区外的图片默认不加载,只有图片进入可视区才加载。这里说的可视区就是你能看到的区域。对于带宽较低的服务器来说,同时加载多张图片可能会导致图片长时间无法加载出,图片懒加载就是只加载用户...

前端 JavaScript 打包和解压 Zip 文件

最近写了个网页版的文件批量处理工具,在本地浏览器端处理完成后只能生成多个下载链接导出文件,比较麻烦,要是能打包文件,一次导出就会方便一些。一般大多数后端语言都会内置有处理 Zip 文件的库,PHP 有 ZipArchive 库,Node.js 有 zli...

网页内容禁止拷贝的实现方式

一些博客网站和写作平台,当你准备拷贝内容的时候可能会发现文字无法被选中,也无法使用 Ctrl + C 或右键拷贝。实现禁止拷贝的方式也很简单,主要就是禁止选择内容,禁止弹出右键菜单,触发拷贝事件的时候阻止拷贝。下面就使用 CSS + JS 实现禁止拷贝,...

JavaScript 实现图片框选裁剪

很多网站和 App 在上传头像的时候,如果图片的长宽比不一样,就需要选择区域裁剪为正方形。在很早以前,基本上只能在前端选择裁剪区域,发到服务器裁剪,现在随着浏览器的功能越来越强大和用户设备性能的提升,基本上可以在前端裁剪完再上传。这里简单实现图片的框选和...

JavaScript 浏览器调用摄像头拍摄视频

之前写了 浏览器调用麦克风录制音频 和 调用摄像头拍摄照片 ,这里就继续来调用摄像头拍摄视频。拍摄视频和录制音频的方法其实是差不多的,使用的也是 MediaRecorder 媒体录制接口,录制音频只需要申请麦克风,录制视频需要同时申请麦克风和摄像头。下面...