- 博客(26)
- 收藏
- 关注
RSS订阅原创 vue中使用vue-pdf实现多个pdf文件的循环输出，且每个PDf文件有自己的分页
问题描述：页面展示多个pdf文件，且每个PDF文件有自己的分页，分页之间不会互相干扰。问题解决方案：将分页设置为一个数组，先定义一个空的数组，然后获取总文件个数进行循环，每循环一次，在空数组中push当前页，总页数这些变量，然后在页面进行渲染。1. 定义空数组data () { return { pathList: [], currentArr: [], fileType: 'pdf', // 文件类型 src: '', // pdf文件
2021-02-09 10:30:02
3629
7
原创 vue中echarts环形图：1.实现鼠标移入移出环形图中间显示不同的内容 2.环形图抖动
问题详细描述：制作echarts环形图，环形图中间默认显示总量，鼠标移入对应的部分，中间显示相对应的数量。问题解决方案：利用标题和副标题展示默认总量，再在series设置鼠标移入移出展示的数量以及位置。详细步骤如下：1.设置标题和副标题展示默认总量，设置位置以及样式。代码如下：title: { text: '总任务数', subtext: 2, left: 'center', top: '45%',
2021-02-09 09:53:58
4386
2
原创 使用ztree 自定义样式做树形结构，通讯录
ztree简单的自定义图标1. 首先新建一个空的ul<ul id="treeDemo" class="ztree"></ul>2. 对数据进行渲染 这个时候可以加上自己提前下载好的自定义的图标 var zNodes =[ { id:1, name:"XXX项目", open:true,iconOpen:"content/images/img/fileopen.png",iconClose:"content/images/i.
2020-06-02 17:02:19
915
2
原创 echarts图表 柱状图、饼图、折线面积图、雷达图，地图样式设置及调整
1.柱状图柱子、x轴、y轴、网格线颜色设置 ，包括渐变色var option = { tooltip : { trigger: 'axis' }, calculable : true, xAxis : [ { type : 'category', data: ["法
2020-06-02 16:44:02
2393
1
原创 如何将webstorm中的项目在手机端查看，也就是说如何将webstorm与手机链接。
1. 首先打开webstorm,打开设置。2.找到debugger3.允许勾选访问外部链接。Can accept external connections4.允许未签名的请求 Allow unsigned requests5.cmd打开命令行，输入ipconfig 找到电脑的ip地址。6、手机和电脑连接同一个wifi.7.将本地路径的localh...
2019-11-07 17:10:55
2054
原创 自定义select下拉框，解决select下拉框在IE上的样式异常
<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" href="content/font/iconfont.css"> <style type=...
2019-11-07 15:43:52
1274
原创 补充之前的手机端 安卓和ios关于兼容性的问题
/*列表页内容*/.infobox{ width: 100%; padding: 0 0.2rem; box-sizing: border-box;}.listcon a:hover{ text-decoration: none; color: #3090F2;}.listcon li{ width: 100%; border-b...
2019-08-22 14:41:41
221
原创 PC端项目踩过的坑
1.<input class="localfile1" type="file" accept=".xls,.doc,.txt,.pdf"> 在不同浏览器上的显示效果解决办法：可以自己写一个按钮，定位到这个按钮上，模拟上传按钮。.block{ position:relative;}.localfile { background: #085ab0; ...
2019-08-22 14:28:52
334
原创 解决在npm run dev 运行vue项目时遇到的webpack 报错问题
报错情况：碰到这种情况 首先 webpack -v 查看是否已安装了webpack,如果出现版本号，证明安装成功，如果没有版本号，就npm install -g webpack 安装webpack如果是以下情况 ，证明失败 ， 可以 npm cache clean --force 清除缓存 然后在npm install -g webpack 安装webpack;...
2019-02-27 15:50:09
4445
原创 微信分享缩略图展示
var urlhref = window.location.href; //打开页面的urlvar appid = ''; //公众号appidvar noncestr = ''; //生成签名的随机串var times = ''; //微信时间戳var urlll = ''; //调用地址var sign...
2019-02-21 16:45:44
701
1
原创 类似易企秀的h5页面如何制作，邀请函，贺卡
有时候需要自己开发类似易企秀的页面，例如邀请函，贺卡<!DOCTYPE html><html><head> <meta charset="UTF-8"/> <meta name="viewport" content="width=device-width,initial-scale=1,maximum-sca
2019-02-21 16:38:35
1105
原创 h5 audio插入音乐之后，微信端 ios上不能正常播放，安卓上可以
之前做了个类似易企秀的h5邀请函，发现微信端ios不能自动播放音乐，于是有了以下的解决方案 //html<audio id="Jaudio" class="media-audio" src="yinyue.mp3" preload loop="loop"></audio >//js<script> function audio
2019-02-21 16:30:24
1286
原创 做网站遇到的兼容性问题，包括兼容ie8以下
1.如果在做网站的过程中用到了jquery,又要兼容低版本的浏览器，尽量用低版本的jquery，而不是最新的，高版本的哦；Jquery从2.x版本开始已经不再进行IE低版本(IE6、IE7、IE8)的兼容性处理。如果需要兼容低版本的IE版本，建议使用原生JS或者低版本的Jquery1.x版本。一般的处理方式是判断不同的浏览器写不同的js,例如：<script language=...
2019-02-21 16:04:26
2619
原创 Windows系统安装nodejs，和webpack的结合，搭建Vue项目
1、打开node.js官网，下载Windows包，在电脑上安装，这个下载包的时候 注意和自己所做的系统和电脑进行匹配，如图：2、使用WIN+R快捷键打开cmd，查看是否安装成功；输入命令：node -v 查看nodejs版本号,如果出现了版本号，说明安装成功；输入命令：npm -v 查看npm版本号,如果出现了版本号，说明安装成功；3、安装cnpm node环境已经安...
2018-02-28 22:11:52
1572
原创 手风琴轮播
.banner_box{width: 100%;height: 400px;border:2px solid bisque;/*overflow: hidden;*/}.banner_box div{width: 158px;height: 100%;float: left;overflow: hidden;}img{/*width: 100%;
2018-01-21 17:08:51
316
原创 滑动式轮播
*{margin: 0;padding: 0;}li{list-style: none;}.banner{width: 650px;height: 400px;/*border:1px solid black ;*/overflow: hidden;position: relative;}.banner ul{width: 650px;
2018-01-21 17:07:21
163
原创 自动式轮播
*{margin: 0;padding: 0;}li{list-style: none;}.banner{width: 600px;height: 340px;border: 1px solid black;overflow: hidden;position: relative;margin: auto;}img{width: 600
2018-01-21 17:02:25
258
原创 点击指定的图片变换背景图
h1{ width: 100%; color: palevioletred; text-align: center; } ul{ width: 100%; height: 140px; float: none; display: block; position: absolute; top: 200px; left: 100p
2018-01-05 18:36:37
1087
原创 5秒之后跳转到指定的页面
#txt{ width: 200px; height: 40px; } .one{ border: 1px solid lightsalmon; background: lightsalmon; color: white; } /*a{ color: black; text-decoration: none; font-siz
2018-01-05 18:35:36
1925
原创 方块随机出现在不同的位置
#box{ width: 400px; height: 400px; border: #FFC0CB solid 2px; position: relative; overflow: hidden; } .two{ position: relative; } .one{ position: absolute; }
2018-01-05 18:32:55
1351
原创 打地鼠游戏
.hole{ width: 100px; height: 100px; float: left; position: absolute; /*background: aliceblue;*/ } 分数:0 第1关 var time1,
2018-01-05 18:28:59
331
原创 简易留言板
.one{color: red;cursor: pointer; } 简易留言板 var count = 0; window.onload = function(){ var msg = document.getElementById("msg"); var btn = docum
2018-01-05 18:21:22
354
原创 如何实现Hbuild与手机端的连接
如何实现Hbuild和手机端的连接具体步骤如下： 1、打开Hbuild，点击工具栏上方的浏览器旁边的倒三角，找到最后一行，设置WEB服务器，如下图： 2、点击设置web服务器，进入以下页面，点击外置web服务器设置： 3.点击新建： 4、设置名字，浏览器路径 ，路径是自己所联网的路径，那如何获得路径呢，win+r,出现如下界面，输入
2018-01-04 22:25:29
7293
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人