- 博客(14)
- 收藏
- 关注
原创 vue在图片上打标签类似小红书,配合html2canvas截图存储,html2canvas截图后图片丢失只剩标签
vue在图片上打标签类似小红书,配合html2canvas截图存储,html2canvas截图后图片丢失只剩标签1.需求:拿到一张网络图片给他打上标签,标签可以编辑,拖动改变位置,将打完标签的图片传给后端进行存储,效果如下2.实现:没有找到合适的插件直接使用,在jquery.image-label.js插件的基础上进行改造使用。2.1 首先jquery.image-label.js是个js插件,需要将其引入到vue中(jquery.image-label.js下载地址)import $ from
2021-01-30 18:27:23 1015
原创 图片转base64跨域问题
vue图片转base64跨域问题,亚马逊存储1.问题说明:如果资源存在是放在国内(如七牛)在转base64的时候不会发生跨域,但本项目存储空间选择的是亚马逊S3,在转化的时候出现了跨域2.解决2.1 首先设置image.crossOrigin = 'Anonymous’来解决跨域2.2 在图片地址的后面加个随机数解决缓存问题image.src = “https://service-pic-us-west-1-dev.s3-us-west-1.amazonaws.com/210119144355
2021-01-30 17:36:34 2287 1
原创 图片裁剪工具vueCropper跨域解决
图片裁剪工具vueCropper跨域解决1.报错原因:本项目的图片放在亚马逊,需求是直接拿到网络图片进行裁剪2.解决:将图片转化成base64Vue.prototype.getBase64Img = function(params) { if (params && params.url) { var that = this; var image = new Image(); image.s
2021-01-30 17:14:06 2428
原创 vue吸管拾色器、利用canvas获取坐标点颜色、canvas获取坐标点颜色图片跨域、图片转base64、colorPicker
vue吸管拾色器、利用canvas获取坐标点颜色1.需求:表格中主颜色和次颜色是需要从缩略图上吸取颜色,然后渲染色块,将色值传给后台
2020-12-02 20:05:45 2475 1
原创 动态改变浏览器标签栏中的网站图标、浏览器标签栏ico图标加通知数量、浏览器标签栏小徽章图标、favico.js
动态改变浏览器标签栏中的网站图标、浏览器标签栏ico图标加通知数量、浏览器标签栏小徽章图标、favico.js1.效果图2.写在前面效果比较常见,网上也有好多帖子,只是没做过找资料的时候不知道如果描述,就比较难受3.实现3.1 a.vue可以使用npm install favico.js b.引入import Favico from "favico.js" c.`var favicon=new Favico({ animation:'none' }); favic
2020-11-19 14:45:43 715
原创 js使用lottie读取json文件并修改文件参数后渲染
js使用lottie读取json文件并修改文件参数后渲染1.效果图说明:车辆模型是通过json文件渲染的2.代码2.1 引入lottie.js(如果没有,网上资源很多,请自行下载)<script src="../../js/lottie.js"></script>2.2 读取json文件$.ajax({ type:'get', url:'http://bucket1.bba.vip/200825173053KykwGnSP39.json',//这里
2020-10-22 11:58:41 1973
原创 canvas生成姓氏头像,上传七牛后传给后端
canvas生成姓氏头像,上传七牛后传给后端1.需求:像苹果手机的通讯录一样,如果没有上传头像就读取他的姓氏。需要前端生成头像后先上传七牛,将拿到的资源id传给后端存到数据库,用于之后的信息读取2.效果图:3.实现大家有听过html2canvas吗?刚开始拿到需求的时候我首先想到的是html2canvas,试过之后发现并不是很合适,这个更偏向于将dom元素转化成图片,而我们需要的是创建图片并用文字填充,最后觉得还是canvas更简单,话不多说,上代码,我的项目用的是vue,这里以vue为例:实
2020-09-27 16:10:00 316
原创 js双击事件dblclick/ondblclick
js双击事件爬过的坑<html><head><script type="text/javascript" src="/jquery/jquery.js"></script><script type="text/javascript">$(document).ready(function(){ $("button").dblclick(function(){ $("p").slideToggle(); });});<
2020-09-02 20:37:10 4288
原创 js利用pinchzoom.js实现移动端模仿微信头像点击放大、缩放
js利用pinchzoom.js实现移动端模仿微信头像点击放大、缩放众里寻他千百度,蓦然回首,那人却在灯火阑珊处。。。写这个功能的时候有点儿这个意思,如果你的需求是和微信头像的点击缩放还原功能相似,请拿走代码直接用????!刚开始觉的应该是那种网上一搜一大把的,结果。。。只能自己写了,但是想了想缩放不好写,还是得借助支持缩放的插件,试了很多,最后发现pinchzoom.js很好用,轻量使用方便,三行代码解决,这里先顺便说一下touch.js,touch.js确实功能比较多,拖拽、缩放等,所以不都轻量,使用
2020-06-26 19:11:34 2417 1
原创 jq国际化jquery.i18n.properties简单使用,跟着步骤来,超级简单
最初使用jquery.i18n.properties是为了实现项目国际化中英文字段对照表,这样可以把中英文的翻译工作减轻不少,用法很简单,我就是在简单使用的基础上稍微简化一、项目目录
2020-05-25 21:29:55 2828
原创 vue element-ul el-table表格自定义表头(多种实现法)
vue element-ul 表格自定义表头需求:自定义表头,点击出现下拉菜单,如图所示实现一:通过el-table自带的Scoped slot属性(推荐)代码:<el-table-column label="专属技师" prop="rFollowUpEntityList" :min-width="350"> <template slot="header" slot-scope="scope"> <el-popover placement="bottom" wi
2020-05-22 21:17:15 9321 1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人