- 博客(103)
- 资源 (4)
- 收藏
- 关注
RSS订阅原创 rotateY定位元素无法遮盖
页面上有一个3d的转动元素，再加弹窗发现遮盖不住。z-index怎么设置都无效，改为transformtranslateZ(999px)即可。可以理解为2d平面用z-index，3d用z轴位移区分上下层。
2022-07-15 16:17:20
369
原创 web端腾讯PAG初体验
Portable Animated Graphics 是一套完整的动画工作流解决方案。提供从 AE (Adobe After Effects) 导出插件，到桌面预览工具，再到覆盖 iOS，Android，macOS，Windows，Linux 和 Web 等各平台的渲染 SDK。PAG 的目标是降低或消除动画研发相关的成本，打通设计师创作到素材上线的自动化流程。.........
2022-06-14 16:13:25
3801
原创 css实现3d翻转效果
直接看代码！.outbox{ perspective:300px; /* 脱离平面屏幕束缚，元素离观察者眼睛的距离, 只能用在3d动画 */ -webkit-perspective:300px; } .inner{ transform-style: preserve-3d; /* 动画方式 3d */ -webkit-transform-style: preserve-3d; transition: 1s ease-in-out; /* 运动速度，变速运动
2021-09-29 17:50:49
1203
原创 微信浏览器 viedeo自动播放
<video muted autoplay />setTimeout(()=>{ let video = document.getElementsByTagName("video") video[0].play() },0)document.addEventListener("WeixinJSBridgeReady", function () { let video = document.getElementsByTagName("video".
2021-09-17 19:58:40
2766
原创 页面刷新vuex state数据丢失
解决思路：监听页面刷新，将state状态保存到sessionStorage初始化项目时，判断sessionStorage是否有state状态，有的话合并，完成状态复现// App.vueexport default { name: 'App', created() { if( sessionStorage.getItem("store") ) { this.$store.replaceState(Object.assign({}, this.$store.state,
2021-09-08 11:48:29
180
原创 js复制文本功能
之前简单的实现，发现 ios 老版本 会出现失效的问题let copycode=document.getElementById("copyUrl") // 文本框copycode.select(); // 选择对象document.execCommand("Copy"); // 执行浏览器复制命令最终找到第三方插件 clipboardimport Clipboard from "clipboard"let clipboard = new Clipboard("#copybtn", { te
2021-08-30 16:56:44
198
原创 修改element ui
选择框 el-checkbox // 分 选中 hover 选中 获取焦点 四个状态 .el-checkbox__input.is-checked .el-checkbox__inner{ background-color: #00bb5a; border-color: #00bb5a; } .el-checkbox__inner,.el-checkbox__inner:hover{border-color: #00bb5a;} .el-checkbox__i
2021-08-14 22:58:00
243
原创 chrome禁止http自动变成https
Chrome 浏览器地址栏中输入 chrome://net-internals/#hsts在 Delete domain security policies 中输入项目的域名，并 Delete 删除可以在 Query domain 测试是否删除成功
2021-08-11 11:15:28
276
原创 npm ERR! ERESOLVE unable to resolve dependency tree
npm install npm@6.14.10 -g
2021-06-22 15:29:31
487
原创 微信分享h5给好友或朋友圈卡片样式控制
// 首先加载微信jssdk的js文件,可以script直接引用，也可动态创建// <script type="text/javascript" src="https://res2.wx.qq.com/open/js/jweixin-1.6.0.js"></script>const oScript = document.createElement('script'); oScript.type = 'text/javascript'; oScript.sr
2021-04-16 19:58:25
895
原创 audio移动端无法自动播放(safari,chrome,微信内置浏览器)
有同学反映有一个奇葩的问题，audio标签 在移动端无法自动播放。尤其是ios系统，在safari以及微信内置浏览器上。聪明的你肯定能想到如下代码：var audio = document.getElementById("audioID"); audio.play();发现不行后思索一番，决定加一个定时器延时执行。一定是audio没加载完的问题，嗯！一定是！我是天才！！！setTimeout(()=>{ var audio = document.getElementById("
2021-01-19 20:08:45
2061
3
原创 小程序自定义标题栏“navigationStyle“: “custom“
lifetimes:{ attached: function () { let bar = wx.getMenuButtonBoundingClientRect() // 获取胶囊丸信息 // 胶囊的top有时候获取到是0 ，所以兼容 statusBarHeight（刘海的高度，原生标题栏的top，比胶囊的top高一些） let top = bar.top || wx.getSystemInfoSync().sta.
2021-01-14 17:38:59
844
原创 什么是浅拷贝，什么是深拷贝？
js数据类型分为，基本类型与引用类型。浅拷贝只能实现，基本类型数据的传值与引用类型数据的传址。并不会为引用数据开辟新的堆内存，这样就会造成，引用类型数据修改，复制数据与原数据都被更改。解决的方法，我们可以使用递归去完成深层次的拷贝（对象与数组）function cloneObj(obj) { if(obj === null || typeof obj !== 'object') return obj if(window.JSON) return JSON.parse(JSON.st
2021-01-12 19:51:23
290
原创 var、let、const三种声明变量的方式之间的具体差别
var let 声明后可变，const声明后不可变，复合类型数据不可变的是储存地址指针，而非属性值，例如下例是没有问题的const obj ={ a: 2}obj.a = 1let const 作用域块作用域 (大括号{})，而var作用于函数作用域或全局作用域if(1){ let a = 1 var b = 2}console.log(b) //2console.log(a) //ReferenceError: a is not definedvar 声明.
2021-01-12 15:00:11
592
原创 答应我，搞懂call、apply好嘛
总结一句话：改变函数内部的 this 指向，并执行函数。call、apply 是 Function 构造函数原型对象上的方法，所有的函数（包括call）都可以调用 call 和 apply。call先看一下原生call的效果（运行在浏览器环境）let context = { name: 'z'}// 全局环境, 用let变量不会挂在window上var name = 'j'function say(age,sex){ console.log(this.name+age+sex
2021-01-05 19:11:17
2240
1
原创 .gitignore规则以及不生效的解决办法
规则规则效果/node_modules‘ / ’ 代表根目录的文件夹node_modules/*包含根目录/node_modules/ 以及子目录 /child/node_modules/!/node_modules/doc.txt‘ ! ’ 代表不忽略，即文件夹被忽略，还是可以指定里面的文件上传*.zip过滤所有zip后缀的文件/pages/index.html过滤具体文件**/node_modules** 代表无论前面多少层级g.
2021-01-04 11:59:19
521
原创 彻底搞懂JS事件循环机制（event loop）
知识点：js异步实现EventLoop、消息队列宏任务 与 微任务同步模式与异步模式首先要确定 js是单线程语言，js在设计之初用作用户互动，以及操作DOM。这决定了它只能是单线程（例如多线程操作同一dom，一个删除一个修改，这样会产生冲突）。但倘若只有同步模式，遇到耗时操作，页面便会阻塞，就像接口请求不到数据，或者图片未加载完成，页面就卡住一直等待。这样显然不现实也不实用。所以异步模式应运而生。你可能会有疑问，单线程的js是怎么完成异步操作的，可以这么理解js是单线程语言，但运行环境可
2020-12-31 14:47:48
9187
10
原创 vue使用wx-open-launch-weapp
页面报错找不到模板wx-open-launch-weapp,可以在main.js配置下面是实测可用代码，替换接口就ok。username替换成你的小程序原始IDstylewidth100%;height100%;paddingclass"btn"
2020-12-14 13:58:15
16166
15
原创 js获取时间戳bug
new Date('2020-12-7')*1获取的是2020-12-7日早八点的时间戳，而不是0点的。。。。一定要写全00:00:00
2020-12-07 00:48:23
435
原创 Mac使用SSH链接github
打开终端创建$ ssh-keygen -t rsa -C "youremail@qq.com"成功后会生成randomart image 。这类似一个棋盘，先将 ssh密码转为二进制，然后从中心点根据一定规律斜向挑格子，感兴趣的可以搜一下。查看ssh并把秘钥复制出来查看cat .ssh/id_rsa.pub { return 0 <= navigator.userAgent.toLowerCase().indexOf("android")}function isIos() { return 0 <= navigator.userAgent.toLowerCase().indexOf("iphone")}function isInWb() { return 0 <= navigator.u
2020-11-23 11:41:51
3374
原创 vue项目使用swiper不轮播
<template> <div> <div> <swiper ref="mySwiper" :options="swiperOptions"> <swiper-slide><img src='~mainassets/img/update/page1.png'/></swiper-slide> <swiper-slide><img s
2020-11-11 18:27:44
419
原创 Access-Control-Allow-Headers 列表中不存在请求标头
问题：跨域请求，大部分浏览器都可以请求，部分（ie，ipone5/6等机型，微信pc端）终端缺发不出请求。。。原因：ie以及低版本Safari 等浏览器不支持跨域请求时，后台配置Access-Control-Allow-Headers为*解决办法：修改后台跨域配置response.setHeader(“Access-Control-Allow-Headers”, "authorization,Authorization,DNT,X-CustomHeader,“Keep-Alive,User-Agent
2020-11-10 17:14:16
3431
原创 再也不怕原生开发甩锅给前端了，教你抓包webview，调试h5！！
随着移动端的发展，越来越多的开发 app内嵌webview 。很多时候本地浏览器没问题，放在app里却问题频出，为了准确的把锅丢给app开发，我们就要掌握 手机抓包的 技法了！！！首先保证手机与电脑在一个局域网，链接统一无线网。下载Fiddler Everywhere 抓包工具。注册账号或者使用google账号登录，这步略过想要完成抓包需要下载电脑以及手机两个证书。先下载电脑证书，勾选 捕获 https请求，要不然只能拦截http请求。然后点击 信任根证书。在设置里 ，勾选允许远程终端链
2020-10-26 17:15:44
5848
原创 js复制文本到剪贴板
<textarea style="position: fixed;z-index: -9999;left: -9999px;" v-model="shareUrl" id="copyUrl" readonly="readonly"></textarea> let copycode=document.getElementById("copyUrl"); copycode.select(); // 选择对象 document.execCommand("Copy");
2020-10-16 14:02:16
342
原创 解决git: Authentication failed for
Authentication failed身份验证失败，大概率账户失效或者密码错误push的时候遇到这个问题，需要重新配置账号密码cmd界面执行语句，重置账号密码git config --system --unset credential.helper执行时可能会遇到报错git error: could not lock config file C:/Program Files/Git/etc/gitconfig: Permission denie原因是系统文件权限不够，无法操作文件。只需找到
2020-10-12 16:57:20
604
原创 css小细节
/** 移动端隐藏滚动条*/.hideScrollbar::-webkit-scrollbar{ display: none;}/** 去除 移动端点击黑色阴影效果 */*{-webkit-tap-highlight-color:transparent;}
2020-09-23 17:44:58
241
原创 安卓fixed元素被键盘顶起
var isAndroid = navigator.userAgent.indexOf('Android') > -1 || navigator.userAgent.indexOf('Adr') > -1; if (isAndroid){ var win_h = document.documentElement.clientHeight, that = this window.addEventList
2020-09-14 14:05:57
546
原创 vue + iview 地址选择器（100%实现有赞后台地址选择器）
记得点赞+评论+关注~~接触到有赞地址选择器，感觉不错，他是react + zentUI 。项目是vue，所以用vue + iview 2.0做了个一模一样的，效果图：iview 2.0使用首先下载npm install view-design --savemain.js全局引用import ViewUI from 'view-design';import 'view-design/dist/styles/iview.css';Vue.use(ViewUI);组件源码
2020-07-21 10:39:42
1102
原创 emoji表情导致输入框maxlength失效
emoji在ios占两位字符长度，但是maxlength里系统认为是一位字符长度，导致文本长度输入会溢出。这时除去要在input或者textarea 加上maxlength属性，还要监听输入事件，超出长度就截取字符串catchu(){ if(this.des.length>200){ this.des = this.des.substring(0,200) }}...
2020-07-08 12:34:31
2459
原创 iview表单校验
ruleValidate:{// 自定义规则校验 address: [ { required: true, message: "请选择并输入经营地址", trigger: "blur", validator: () => { return ( !!this.formValidate.choseAdd &&
2020-07-07 11:10:35
541
原创 js页面回到顶部
toTop(){ this.timer = setInterval(() => { let topDistance = document.documentElement.scrollTop || document.body.scrollTop; let moveDistance = Math.floor(-topDistance / 5); document.documentElement.scrollTop = document.body.scrollTop = topD
2020-06-28 19:17:47
248
原创 移动端相册选择并上传图片
<input ref="fileInput" multiple id="fileInput" @change="getImg" type="file" accept="image/jpeg,image/jpg,image/png"><img :src="item.src" alt="" srcset="" v-for='(item,index) in upImg' :key="index">getImg(){ let inputDOM = this.$refs.fil
2020-06-18 12:57:07
544
原创 css字体流光
<p>字体流光</p>@-webkit-keyframes masked-animation { 0% { background-position: 0 0 } to { background-position: -100% 0 } } .com-loading-text { text-align: center; font-weight: 800; font-size: 40px;
2020-06-10 16:39:42
521
原创 iphone app内嵌网页高度100%问题（底部有白条）
蓝色div,紫色body（高度均为100%）黑色fixed定位bottom:0 。发现元素无法填满，定位也到不了底部。百思不得其解。在一整天的 调试过后，终于发现了奥秘首先，你的页面meta标签要设置正确,最主要的就是 viewport-fit=cover<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=
2020-05-14 17:39:24
2493
原创 h5 ios端键盘收回页面空白
// jsdocument.body.addEventListener("focusout", () => { let currentPosition = document.documentElement.scrollTop || document.body.scrollTop || 0; this.currentPosition = currentPosition-1 setTim...
2020-05-08 11:29:36
465
原创 手把手教你vue项目使用fullcalendar
组件官网 与 配置文档首先下载npm install --save @fullcalendar/core @fullcalendar/daygrid引用css 与 js<script src="~@fullcalendar/core/locales/zh-cn.js"></script><style lang='scss' scoped>...
2020-04-30 11:52:45
7482
4
原创 手把手教你nginx解决前端本地跨域问题
先下载ngnix，因为大部分人是windows 开发环境，所以文章介绍的也是windows版本这是目录打开配置文档，新建一个自己的配置文件my.conf，引用 nginx.conf server { listen 8888; #监听端口 可以访问127.0.0.1:8888 server_name localhost; #...
2020-04-27 13:42:13
3121
原创 We're sorry but *** doesn't work properly without JavaScript enabled. Please enable it
把vue-router的mode 由history 转成 hash如果坚持用history，需要后台配置 配置链接 。因为history模式跳转的是 虚拟路径，浏览器会找路径下的index.html，发现没有，这时就需要nginx去找真实的index.html。如果是文件在子目录，而不再根目录下。需要在 vue.config.js下配置， publicPath，这个默认是’/’ 。设置成...
2020-04-23 15:19:14
11653
iview仿有赞地址选择器
2020-07-20
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人