![](https://img-blog.csdnimg.cn/20201014180756738.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端
qq_20777797
这个作者很懒,什么都没留下…
展开
-
使用element UI el-upload组件上传图片或视频时获取尺寸
const isSize = new Promise((resolve,reject)=>{ if(type == '图片') { //上传文件为图片类型 let img = new Image() img.onload = function(){ resolve(img) } img.src = URL.createObjectURL(file.raw) }else { //上传文件为视频类型 var videoUrl = .原创 2020-11-19 10:06:26 · 1969 阅读 · 1 评论 -
Echarts tooltip不影响其样式地给文字加单位
Echarts tooltip不影响其样式地给文字加单位代码:formatter: function (params) { var result = params[0].name + "<br>"; params.forEach(function (item) { if (item.value) { result += it...原创 2020-03-16 16:44:57 · 601 阅读 · 0 评论 -
Lodash之throttle(节流)与debounce(防抖)总结
防抖动和节流本质是不一样的。防抖动是将多次执行变为最后一次执行,节流是将多次执行变成每隔一段时间执行。throttle API走起_.throttle(func, [wait=0], [options={}])func (Function): 要节流的函数。[wait=0] (number): 需要节流的毫秒数。[options={}] (Object): 选项对象。[op...转载 2020-03-06 16:42:26 · 659 阅读 · 0 评论 -
如何让css背景图片占满全部背景,并且保持长宽比呢?
如何让css背景图片占满全部背景,并且保持长宽比呢?body{ background-image: url("<%=basePath%>res/index_head_1.jpg"); background-position: center; background-repeat: no-repeat; ...转载 2020-02-07 18:07:17 · 1399 阅读 · 0 评论 -
css3渐变 两边透明中间高亮
颜色自己可以调节如图:采集器管理下面的那条线就是css代码:.linear{ width:100%; height:2px; background: linear-gradient( to right, rgba(0,0,0,0) 0%, ...转载 2020-02-07 18:05:11 · 1136 阅读 · 0 评论 -
css实现内凹圆角样式
最新开发遇到一个弹框,弹框中间有两个内凹的半圆,而且还是透明的,不能遮挡到底层的内容。基于这个需求,找到了一个比较好的实现方法。先上一下demo效果图:实现这个效果主要是用了background-image 结合径向渐变radial-gradient。示例:background-image: radial-gradient(circle 10px at 0 100%, transpa...转载 2020-02-07 18:01:23 · 2039 阅读 · 0 评论 -
启动本地服务器的方式
在学习three.js时,如果需要引入外部资源如模型或者纹理,那仅仅使用浏览器打开HTML文件会出现跨域等问题,这就需要本地服务器来确保外部资源正确加载。启动本地服务器的两种方式:1.适用于Unix/Mac系统的基于Python的Web服务器> python -m SimpleHTTPServer2.基于NPM的Web服务器> npm install -g http...转载 2019-07-30 17:05:58 · 1599 阅读 · 0 评论 -
在vue中利用TweenMax动画实现数字滚动
让数字在渲染时达到滚动增长的效果mounted() { this.plist = [ { id:1, name:'月职住人口', value:12664103, },{ id:2, name:'月流入人口', value:2330366, }, { id:...原创 2019-07-18 16:15:14 · 2288 阅读 · 0 评论 -
Element UI 和js实现文件的上传和下载
文件上传before-upload参数是在文件上传之前对文件进行一些验证action参数是文件上传的服务器地址this.uploadHref = this.baseUrl + '/tourismManagement/uploadTourismMesExcel';baseUrl: process.env.NODE_ENV === 'production' ? apicon...原创 2019-07-15 14:29:37 · 1840 阅读 · 1 评论 -
登录页面中背景图片平铺及登录框垂直居中
一般登录页面的样式都如下图所示,它的特点是,页面的背景是一张比较炫酷的图片,页面右侧有一个登录框假设页面结构为<div class="login-wrap"> <div class="content"> <p class="header-left hy-header"> 数盾风控点查询 </p> <el-for...原创 2019-07-02 17:40:44 · 3499 阅读 · 2 评论 -
获取URL中查询字符串的参数值
function getQueryStringArgs() { //取得查询字符串并去掉开头的问号 var qs = location.search.length > 0 ? location.search.substring(1):""; //保存数据的对象 var args = {}; //取得每一项 items = qs.length > 0原创 2018-01-25 19:41:19 · 3605 阅读 · 0 评论 -
Ajax跨域请求action方法,无法传递及接收cookie信息(应用于系统登录认证及退出)解决方案
最近的项目中涉及到了应用ajax请求后台系统登录,身份认证失败,经过不断的调试终于找到解决方案。应用场景: 项目测试环境:前端应用HTML,js,jQuery ajax请求,部署在Apache服务器;后端业务系统应用spring mvc,mybatis,部署在tomcat服务器。当在一个系统需要调用另一个系统的时候,就会出现跨域的问题,即本次我们遇到了ajax请求的跨域问题。转载 2017-11-16 09:55:55 · 234 阅读 · 0 评论 -
JS中的call()方法和apply()方法用法总结
最近又遇到了JacvaScript中的call()方法和apply()方法,而在某些时候这两个方法还确实是十分重要的,那么就让我总结这两个方法的使用和区别吧。1. 每个函数都包含两个非继承而来的方法:call()方法和apply()方法。2. 相同点:这两个方法的作用是一样的。都是在特定的作用域中调用函数,等于设置函数体内this对象的值,以扩充函数赖以运行的作用域。转载 2017-11-20 19:02:08 · 190 阅读 · 0 评论 -
正确理解使用Vue里的nextTick方法
`Vue.nextTick(callback)`,当数据发生变化,更新后执行回调。`Vue.$nextTick(callback)`,当dom发生变化,更新后执行的回调。实例:12345678910111213141516171转载 2017-10-14 13:07:14 · 9507 阅读 · 2 评论 -
render: h => h(App) 是什么意思?
背景在学习Vue.js时,使用vue-cli创建了一个Vue项目,main.js文件中有一行代码不知道是什么意思。在网上搜索了下,得到了答案,在此记录下。main.js 文件内容import Vue from 'vue'import App from './App.vue'new Vue({ el: '#app', render: h => h(App)})转载 2017-10-13 11:11:17 · 1362 阅读 · 0 评论 -
利用setInterval()实现每隔两秒依次出现数组中的一个值
Title arr=[1,2,3,4,5,6,7,8,9]; i=0; var t=setInterval('show()',2000); function show() { $("#time").append(arr[i]); i=i+1; //如果超过数组长度,清除定时器 if(i>arr.lengt转载 2017-10-28 10:21:39 · 4338 阅读 · 0 评论 -
vue列表渲染,以及鼠标点击改变样式的问题
在实际项目中,我们进场会遇到鼠标点击该表某个DOM元素来添加样式,在原生的js或者jquery中,我们会比较熟练的实现这个需求,但是在vue中怎么实现呢?我最初的想法是直接操作dom,即在鼠标点击该表某个DOM元素之后,取到event.target,然后给它添加class,但是遇到一个问题就是想一开始进入页面就给列表中的第一个元素添加上样式,但是在created和mounted方法中取do转载 2017-10-19 15:05:51 · 9584 阅读 · 3 评论 -
css3 animate动画每循环一次的时间间隔设置方法
.item{ webkit-animation: revolving 4s 0s infinite; animation: revolving 4s 0s infinite;}@-webkit-keyframes revolving{ 0,75%{ -webkit-transform: perspective(700px) rotateX(90deg); } 87.5转载 2017-09-09 16:32:22 · 38156 阅读 · 1 评论 -
CSS3中和动画有关的属性transform、transition 和 animation
CSS3中和动画有关的属性有三个 transform、 transition 和 animation。下面来一一说明:transform从字面来看transform的释义为改变,使…变形;转换 。这里我们就可以理解为变形。那都能怎么变呢? none 表示不进行变换; rotate 旋转 transform:rotate(20deg) 旋转角度可以为负数。需要先有trans转载 2017-09-09 16:23:54 · 554 阅读 · 0 评论