- 博客(25)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 开发小程序碰到的问题
背景开发小程序偶尔会需要携带数据跳转页面，一般是在链接上带参数一起跳转页面。有些参数有特殊符号或者值是一个json，这里就需要借助encodeURIComponent()对参数值进行编码，到目标页面后再用decodeURIComponent()进行解码，一直这样没碰到什么问题。后来需要增加分享功能，这时候还是一样在分享的链接带上参数，进行编码就可以了，本地一直没问题，直到传到体验版，这时候发现解码出现了问题，解码结果不是我们的数据。。。还是编码的结果。解决将上述解码的结果再次解码，就得到原先的数据！！
2021-07-01 14:12:44
132
原创 clip-path
使用裁剪方式创建元素的可显示区域。区域内的部分显示，区域外的隐藏。语法clip-path: <clip-source> | <basic-shape> | <geometry-box> | none;<clip-source>: 剪切元素的路径<basic-shape>: 定义图形，有四个值inset , circle , ellipse , polygon<geometry-box>: 它将为基本形状提供相应的参考框盒。通
2021-06-09 18:38:29
563
原创 弹性布局 flex属性详解
弹性布局flex属性详解弹性布局里的flex属性主要用于容器里子元素的空间分配，flex属性有三个属性值，分别为flex-grow,flex-shrink,flex-basis语法flex: none | [ <‘flex-grow’> <‘flex-shrink’>? || <‘flex-basis’> ]默认值为0 1 auto。后两个属性可选flex-grow：子元素的放大比例，默认0(不放大，即使容器有剩余空间，也不使用)flex-shrink：子元
2021-04-01 18:08:32
731
原创 JavaScript数组方法
可向数组的末尾添加一个或多个元素，并返回新的长度语法arrayObject.push(item1,item2,…,itemX)用于删除并返回数组的最后一个元素语法arrayObject.pop()返回值arrayObject 的最后一个元素说明pop() 方法将删除 arrayObject 的最后一个元素，把数组长度减 1，并且返回它删除的元素的值。如果数组已经为空，则 pop() 不改变数组，并返回 undefined 值。用于把数组的第一个元素从其中删除，并返回第一个元素的值语法ar
2021-02-01 19:02:53
220
原创 flex布局
flex布局简介Flex是Flexible Box的缩写，意为”弹性布局”，用来为盒状模型提供最大的灵活性使用给元素添加display: flex 就能使用.box { display: flex;}行内元素也可以用.box { display: inline-flex;}webkit内核的浏览器须加-webkit前缀.box { display: -webkit-flex; display: flex;}注：使用flex布局后，子元素的flo
2020-12-29 17:28:54
199
转载 vue中ref的作用以及使用
ref 被用来给元素或子组件注册引用信息。引用信息将会注册在父组件的 $refs 对象上。如果在普通的 DOM 元素上使用，引用指向的就是 DOM 元素；如果用在子组件上，引用就指向组件实例1、获取dom元素<template> <div id="app"> <div ref="testDom">11111</div> <...
2020-04-22 16:58:25
1312
原创 vue 使用axios访问后台数据
1、安装axios和qsaxios是一个基于Promise用于浏览器和node.js的HTTP客户端。特征1、从浏览器中创建XMLHttpRequest2、从node.js发出http请求3、支持Promise API4、拦截请求和响应5、转换请求和响应数据6、取消请求7、自动转换JSON数据8、客户端支持防止CSRF/XSRF安装npm install axios --s...
2020-04-17 15:37:55
890
原创 git 提交代码
本地仓库未创建 git init git add . (“.”表示提交全部文件，若要提交某个文件可把“.”换成文件名) git commit -m "first commit" git remote add origin url.git(url为仓库地址) git push -u origin master本地仓库已创建git remote add origin url.git(u...
2020-04-10 16:58:07
169
原创 文字轮播效果
这里写自定义目录标题纵向横向纵向代码ul { list-style: none; margin: 0; padding: 0; } #content li { font-size: 14px; height: 20px; line-height: 20px; ...
2020-01-10 17:06:04
205
原创 开发前端项目遇到的问题
移动端new Date()new Date(“2019-12-30 23:59:59”).getTime()，苹果手机ios用js的Date() 获取到的日期时间，显示NaN，安卓手机正常。解决方法：new Date(“2019/12/30 23:59:59”).getTime()。正则替换方法：“2019-12-30 23:59:59”.replace(/-/g, ‘/’)audio标...
2019-12-30 11:11:51
971
原创 PhotoSwipe插件，类似手机相册查看图片，可左右滑动，缩小放大
下载地址：https://github.com/dimsemenov/photoswipe#引入 <link rel="stylesheet" href="js/photoswipe/photoswipe.css"> <link rel="stylesheet" href="js/photoswipe/default-skin/default-skin.css">...
2019-10-24 15:59:44
906
原创 Canvas相关知识点
html结构<canvas id="canvas">当前浏览器不支持canvas，请更换浏览器后再试</canvas>注意：设置canvas的宽高建议不用css设置，可在canvas标签里写或者在script里写canvas.width = 800;canvas.height = 800;canvas先设置状态再进行绘制绘制线context.moveTo...
2019-03-01 14:57:41
422
原创 移动web HTML5使用photoswipe模仿微信朋友圈图片放大浏览
原文网址：http://www.cnblogs.com/theroad/p/5397229.html使用js框架是PhotoSwipe。PhotoSwipe是一个图片放大插件，兼容pc和移动端，经历过多个版本的迭代且一直在不断更新，踩过的坑不知凡几，在移动端有着巨大的优势。1、可控制多种风格如：标题、分享、全屏按钮，点击事件、是否加入字幕，背景透明等。2、可支持移动端触摸手势兼容pc端...
2019-02-15 13:34:41
828
转载 vscode es6语法配置检测
话说，为了配置vscode，es6语法自动检测，百度的各种攻略，踩坑不少，最重要还没用。。。。。。将最后解决的方法分享大家，共同进步！配置方法：1.插件下载 ESLint，JavaScript(ES6) code snippets打开vscode —点击右侧扩展商店—搜索框输入es,找到以下2个插...
2019-02-02 11:28:48
3899
原创 移动端H5页面开发的几种方法
单位： px宽度百分比，高度px在不同屏幕下的效果是不一样的，可用媒体查询（@media）对不同宽度的手机进行适配，麻烦，不推荐使用单位：rem1、flexible用法：https://blog.youkuaiyun.com/sinat_27358671/article/details/827722062、原生js重置rem单位(function (doc, win, imgW) { ...
2019-02-02 09:48:30
21751
2
原创 雪花飘落特效改成落下红包雨，几秒钟后雪花消失
有些手机网站，进入首页会有雪花飘落，或者其他什么飘落，雪花飘落特效是网上找的一个插件，链接：http://www.bvbcode.com/cn/btqof3gv-893846-down。 现在有一个需求，将雪花改成红包，但是红包不要一直飘，只需要飘几秒钟，几秒钟之后红包消失。因此在雪花飘落特效的基础上进行修改。 飘落图片的大小是随机的，如下图，红框里为随机生成的大小，最小值...
2019-01-31 17:17:13
809
原创 数字从0增长到指定数字
效果如图，数字从零开始增长，增长到123456时停止HTML<div id="num">0</div>css#num { margin-top: 100px; text-align: center;}#num img { display: inline-block; width: 52px;}jsvar num = 1...
2019-01-29 14:26:00
3365
转载 VsCode快捷键
按 Press功能 FunctionCtrl + Shift + P，F1显示命令面板 Show Command PaletteCtrl + P快速打开 Quick OpenCtrl + Shift + N新窗口/实例 New window/instanceCtrl + Shift + W关闭窗口...
2019-01-28 11:21:02
197
原创 手机网站，第一次进入网站显示广告海报，浏览其他页面回到首页不显示
很多APP、网站刚进入都会显示广告弹窗或者海报，浏览其他页面返回首页不再显示，当关闭网站再重新进入到首页再显示，可以考虑用cookie或者本地存储，本文介绍的是H5的本地存储。关于HTML5本地存储的知识HTML本地存储有两个对象：localStorage和sessionStorage。localStorage: 永久储存，删除数据需要手动删除；sessionStorage: 浏览器关闭数...
2019-01-25 16:54:30
869
原创 Date对象的一个小例子
简单的一个date对象的小例子。功能，获取当前月份的天数以及对应周几。1、获取某一个月份的天数。例如2月份有几天，代码如下var date = new Date(2019,2,0);var days = date.getDate();运行效果如下：2019年2月份有28天（若为闰年，则为29天，不需要再进行判断）2、根据日期获取星期几，例如获取2019年1月22日是星期几var d...
2019-01-22 15:25:58
593
原创 Date对象
获取时间var t = new Date();获取时间的方法t.getYear();//获取年份:从1900年开始计算，获取到的是2~3位数的年份t.getMonth();//获取月份:月份从0开始计算，0代表1月，11代表12月t.getDate();//获取天数t.getDay();//获取星期几:0~6 从0开始，0代表周日t.getHours();//获取小时t.getM...
2019-01-21 13:59:25
164
原创 学习vue 目录结构
创建完项目后，目录如下图 目录/文件 说明 build 项目构建(webpack)相关代码 config 配置目录，包括端口号等。我们初学可以使用默认的。 node_modules npm 加载的项目依赖模块 src 这里是我们要开发的目录，基本上要做的事情都在这个目录里。里面包含了几个目录及文件： assets: 放置一...
2018-10-26 15:45:46
167
原创 学习vue——创建项目、打包部署项目
用命令提示符安装vue，创建vue项目一、安装node.js(www.runoob.com/nodejs/nodejs-install-setup.html)检查Node.js版本，用cmd打开命令提示符node --version二、安装vuenpm install vue若用该方法安装，由于npm是国外的，速度会非常慢，建议先安装淘宝镜像npm install -g cnpm...
2018-10-08 15:08:47
269
原创 关于图标的使用
现在很多小图标都用到了字体库，例如：Font Awesome（http://fontawesome.dashgame.com/）， 好处就是保证图标不失真，还可以随意改变图标的颜色以及大小。做移动端的时候，一般图标建议用字体库或者svg，如果图片是图片，可能在不同分辨率的手机下，图标可能会有锯齿甚至模糊，字体库的图标大小可以用font-size来控制。一、Font AwesomeAwes...
2018-09-30 10:58:16
284
原创 flexible.js的使用
移动端项目，考虑到兼容性，现在使用比较多的是用rem。flexible.js是淘宝为了适配移动端开发的一个插件。首先，引入文件，引入flexible.js和flexible.css 或者flexible_css.js,flexible.js；其次，设计稿一般以iphone6的尺寸为标准，宽度为750px;最后，计算方式为： 测量的尺寸/75例：测量一个div的高度为75px，则转化为re...
2018-09-19 14:57:05
8503
flexible.js
2018-09-19
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人