- 博客(12)
- 收藏
- 关注
RSS订阅原创 前端JS压缩图片
'use strict';import EXIF from 'exif-js';class ImageCompressor { constructor (options) { this.defaultOpptions = Object.freeze({ file: null, quality: 0.8, type: 'image/jpeg', scaleSize: 0, pngMaxSize: 2097152, wid
2021-05-05 15:16:47
164
原创 canvas translate rotate
canvas默认的(0, 0)是左上角，translate可以改变这个点的位置。下图100 * 200的长方形，translate(50, 100)后这个点就变成（0， 0），原本左上角此时是(-50, -100)。rotate方法是基于（0， 0）旋转画布,顺时针旋转90度后,x轴和y轴自然也旋转了，此时如果继续基于坐标操作,x,y轴相比之前没旋转是对调的，x轴成为了纵向，y轴是横向。...
2021-04-28 15:44:29
190
原创 css sprite雪碧图 background-position百分比
css sprite图在线生成工具background-position平时使用如background-position: 20px 30px时，背景图与容器（0，0）是对其的，也就是背景图和容器左上角重叠在一起，然后背景图在这个基础上往右移动20px， 往下移动30px。background-position假设指定百分比值，比如一张200 * 200的背景图，和一个100 * 100的容器，指定 background-position: 20% 30%。那么实际上背景图会先将自身（20% 30%）这
2021-02-20 14:16:35
244
原创 linear-gradient百分比用法基础
background: linear-gradient(to right, red, blue);上面一句也可以写成background: linear-gradient(to right, red 0%, 50%, blue 100%);默认第一个颜色是0%，指定渐变从0%处开始， 最后一个是100%，指定渐变到100%结束。如果一个既不是起始也不是终止的颜色中间点，没有被明确声明位置，那么这个颜色就会从前后两个颜色的中间位置开始。下图指定红色渐变从20%处开始，则20%之前红色纯色填.
2021-02-18 14:24:01
576
原创 javascript事件节流与防抖
防抖function debounce (handler, time) { let timer = null; return function () { clearTimeout(timer); const args = arguments; timer = setTimeout(() => { handler.apply(this, args); }, time); }; }节流（可触发最后一次事件执行
2021-01-20 17:13:40
39
原创 前端android禁止用户自定义放大系统字体
配合rem；(function flexible (window, document) { const docEl = document.documentElement; const dpr = window.devicePixelRatio || 1; // set 1rem = viewWidth / 10 function setRemUnit () { const width = docEl.clientWidth > 768 ? 768 : docEl.clien
2020-12-21 16:06:30
380
原创 dos2unix工具中将LF转换成CRLF
core.autocrlf=true 检出时，git 会把文本文件的换行符转化为 CRLF（只转化纯 LF 的文件），提交时，把暂存区的内容转化为 LF 然后放入版本库。转化暂存区的内容时，如果发现里面存在 LF 换行符，LF 会被转化成 CRLF，并警告：“LF will be replaced by CRLF”，但在工作区里，这个文件会保持它原本的换行符。假设设置 core.autocrlf=true ，工作区的文件都应该用 CRLF 来换行。如果改动文件时引入了 LF，或者设置 core.autoc
2020-12-10 20:08:30
1154
转载 git撤销提交
一、未使用 git add 缓存代码时可以使用 git checkout – filepathname (比如： git checkout – readme.md ，不要忘记中间的 “–” ，不写就成了检出分支了！！)。放弃所有的文件修改可以使用 git checkout . 命令。此命令用来放弃掉所有还没有加入到缓存区（就是 git add 命令）的修改：内容修改与整个文件删除。但是此命令不会删除掉刚新建的文件。因为刚新建的文件还没已有加入到 git 的管理系统中。所以对于git是未知的。自己手动
2020-12-01 17:24:54
411
转载 DataURL与File,Blob,Canvas之间的互相转换
DataURL:数据格式的url,src可以直接指向dataURL用来显示图片。图片被转换成base64编码的字符串形式，并存储在URL中，冠以mime-type。Bolb:是一种javascript对象类型，可以存储大量二进制数据HTML5的文件操作对象，file对象就是Blob的一个分支或说一个子集。1.Canvas 转换为 DataURL var dataurl = canvas.toDataURL('image/png') // 图片质量取原质量的0.8 var dataurl2
2020-09-24 17:26:03
352
原创 postmessage跨域不同窗口通信
window.postMessage() 方法可以安全地实现跨源通信,通过const newWin = window.open(url, ‘_blank’)打开新页面并获得新窗口的引用。注意这里第二个参数需要是’_blank‘，就是新建一个窗口，当前窗口不能被关闭，微信公众号里window.open实际还是在当前页面跳转，所以postmessage不生效，目前我不知道怎么解决。a页面给b页面发消息例子：a.htmlconst newWin = window.open(url, '_blank');n
2020-08-25 17:57:29
546
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人