-
vue transition实现展开收起动画2019-05-21 21:52Vue中transition实现展开收起动画transition是vue提供用来实现过渡动画的，可以轻松实现排序，删除，新增等各种动画。但是最近使用transition来实现展开，收起动画时，发现最简便的设置height属性的transition过渡是不起作用的。这种情况是基于我们不知道容器div的高度的情况下。如果div的高度是既定的，那么通过transition实现展开收起动画是能轻松搞定的。对于不定高的div的展开收起动画，我们就需要借助transition的回调函数来来实现了。不啰嗦，直接看代码<template>...
-
获取图片base64编码/预览图片2019-04-17 21:49获取图片base64编码的方法 let img = new image(); let dataURL; img.onload=function(){ var canvas = document.createElement("canvas"); canvas.wi...
-
vue多级权限组件的实现2019-04-07 00:34
首先实现递归checkbox的组件假定，我们要实现的权限组件效果是这样的：要实现点击系统，下面的都全选，点击基础功能，用户管理半选，系统半选。点击新增组织，如果基础功能没有选中，则基础功能改为选中。<template> <div class="permit_cont"> <div v-if="datas.childResoList.length>0" :class="{'top_check':datas... -
canvas实现贪吃蛇小游戏2019-03-07 22:50
canvas实现贪吃蛇小游戏贪吃蛇小游戏体验点击体验通过画布实现的贪吃蛇小游戏。游戏效果如下：小游戏的源码如下：<!DOCTYPE HTML> <html> <head> <meta charset='utf-8'/> <meta name="viewport" content="width=device-width, initial-scale=1.0, minim... -
百度地图自定义图层实现海量点聚合2019-03-04 23:07
百度地图自定义图层 百度地图开发中，地图的覆盖层提供我们往往根据实际项目的需求来展现符合产品的覆盖物，以此来契合整个系统的UI风格等。简单的开发，可以使用百度地图提供的marker,InfoWindow,Label等来实现基本的点位标注，信息展示的。但对于复杂的需求，我们就需要通过自定义覆盖层来实现了。 下面我们看一下自定义覆盖的实现方式：//1，定义一个覆盖物，原型指向BMap的Overlay对象。 function myOver(pt){ &nbs... -
web断点续传的原理和实现2018-11-03 01:00断点续传所谓断点续传，前提是上传文件为大文件，如果文件较小，则体现不出断点续传的优势。断点续传大文件的优势：1、文件上传过程中上传了一半，网络中断，再次上传可以从上次中断处开始上传，节省带宽和上传时间。2、由于断点续传需要验证文件的hash，可以避免相同文件多次上传，节约服务器存储空间，节约用户操作时间，加上友好提示，可以提高用户的体验度。断点续传的实现过程：1、java服务器端我们只做简单介绍，需要实现一个两个接口，一个用来查询对应hash的文件是否已经上传，如果上传，上传了多少，是否完成。另一个接口用来保存上传的内容到文件里面，如...
-
spark-md5生成hash码，spark-md5计算大文件hash码实现断点续传2018-11-01 23:19spark-md5import SparkMD5 from 'spark-md5'; var hexHash = SparkMD5.hash('Hi there'); // hex hash var rawHash = SparkMD5.hash('Hi there'...
-
webpack结合worker-loader来使用webworker2018-11-01 22:57web workerweb worker是js中启动的子线程，不能操作dom和windows对象，但是可以执行ajax，处理复杂数据，如二进制blob数据，或者websocket连接，worker和主线程通过postMessage和onmessage进行通信。本文不是主要介绍worker，主要讲webpack中如何使用web workerworker-loaderwebpack中提供了一个loader叫做worker-loader，用来实现web worker的功能。第一步需要install worker-loadernpm ...
-
vue-router配置一个后台管理系统的实例2018-10-31 22:54
vue-router实例Vue.use(Router) export default new Router({ routes: [ { path:'/manager', name:'login', component:Login, beforeEnter:(to,from,next)=>{ &nb... -
CopyWebpackPlugin配置vue开发中static静态目录2018-10-31 22:35CopyWebpackPlugin插件先看一下这个插件在webpack的配置new CopyWebpackPlugin([ { from: path.resolve(__dirname, '../static'), to:&nbs...
妹纸前端
最新文章
- elm.scrollIntoView 方法介绍
- vue中使用echarts的最佳实现方案
- elementUI中的elTable实现原理分析
- vue中v-loading指令的实现
- Vue中实现React.Fragment，多个duo根元素的解决方案
- Vue的transition中的slidedown,slideUp展开收起动画
- Element.scrollHeight属性,快速获取元素的高度
- 2020年4月4日，全国沉痛悼念新冠肺炎罹难者，纪念在一线抗议牺牲得医护烈士。
- Vue实现Popper跟随弹出层，添加到body中，不受父级元素影响的方式
- 通过Set对象便捷判断所选格子和已占用的格子是否冲突
- vue transition实现展开收起动画
- 获取图片base64编码/预览图片
- vue多级权限组件的实现
- canvas实现贪吃蛇小游戏
- 百度地图自定义图层实现海量点聚合
热门排行
- css box-shadow详解,以及box-shadow立体按钮，box-shadow 四周阴影，box-shadow 单边阴影的实现
- css3的vw单位,vh单位的讲解，以及vw vh的兼容性
- css :not()函数多个条件使用
- HTML5 progress进度条详解
- flex 兼容IE8，flex兼容IE7,通过clear both清除浮动和float 实现兼容IE的flex布局
- JS事件中防抖debounce和节流throttle概念原理的学习
- DIV右上角标签的CSS3实现技巧
- SVG的坐标系变换transform的translate,scale,skew,rotate转换
- JSON.parse报错,Unexpected token o in JSON at position 1,Unexpected token in JSON at position 650
- 光标_input输入框的光标操作，以及选中方式-textRange.select()方法讲解
- Object.assign()用来拷贝对象，类似于jquery的$.extend方法
- NPM 安装React 或者vue-cli时报错npm ERR! code EPERM npm ERR! errno -4048 npm ERR! syscall scandir解决方法
- ES6的模板字符串（template strings）以及带标签的模板字符串
- SVG SMIL动画的begin,end属性详解
- 从数组遍历谈一下js中的递归调用
推荐文章
- elm.scrollIntoView 方法介绍
- vue中使用echarts的最佳实现方案
- elementUI中的elTable实现原理分析
- vue中v-loading指令的实现
- Vue中实现React.Fragment，多个duo根元素的解决方案
- Vue的transition中的slidedown,slideUp展开收起动画
- Element.scrollHeight属性,快速获取元素的高度
- 2020年4月4日，全国沉痛悼念新冠肺炎罹难者，纪念在一线抗议牺牲得医护烈士。
- Vue实现Popper跟随弹出层，添加到body中，不受父级元素影响的方式
- 通过Set对象便捷判断所选格子和已占用的格子是否冲突
- vue transition实现展开收起动画
- 获取图片base64编码/预览图片
- vue多级权限组件的实现
- canvas实现贪吃蛇小游戏
- 百度地图自定义图层实现海量点聚合