- 博客(34)
- 收藏
- 关注
原创 bootstrap+masonry.js写瀑布流
bootstrap+masonry.js写瀑布流JH0610Y 2016-03-28 16:10:21 9502 收藏版权最近在用bootstrap写一个网站,其中有个图文展示的页面要用到瀑布流的效果。因为项目要求,项目要以bootstrap为基准,不准私自添加内联样式、内部样式,所以,自己写瀑布流就不行了,所以,根据要求,百度查找相关资料,看到masonry.js.个人认为这是一个非常好用的瀑布流插件。下面说一下我在引用的过程中遇到的问题,一开始我用bootstrap栅格系统布局,代码
2020-10-13 15:46:10 447
原创 动画效果 aos.css
aos网址https://codepen.io/michalsnik/pen/WxNdvq1234567891011{box-sizing: border-box;}.item {width: 200px;height: 200px;margin: 50px auto;padding-top: 75px;background: #ccc;text-align: center;color: #FFF;font-size: 3em;}AOS.init({
2020-10-13 15:44:36 799
原创 整个屏幕动画 wow.min.js 支持css3多种动画的效果!
WOW.js 需要 animate.css 配合,所以它支持 animate.css 多达 60 多种的动画效果,能满足您的各种需求。wow.min.js可以实现在滚动下的动画状态。https://animate.style/使用方法:1、加入animate.css2、加入wow.js 。(无需引用jQuery)注意new WOW().init();中的WOW要大写,否则就没效果了。3、元素中加入classtada66种CSS3animation动画效果,← 点击查看选择想要的效果,并加
2020-10-13 13:57:07 612
原创 箭头
1.空心箭头.arrow{width: 20px;height: 20px;border-top: 1px solid #f90;border-left: 1px solid #f90;transform:rotate(-45deg);}
2020-09-27 14:22:43 127
原创 日期转化
filters: {formatDate: function(value) {let date = new Date(value);let y = date.getFullYear();let MM = date.getMonth() + 1;MM = MM < 10 ? (‘0’ + MM) : MM;let d = date.getDate();d = d < 10 ...
2020-08-13 14:19:50 107
原创 登录跳转控制,重定向
router.beforeEach((to, from, next) => {let login = localStorage.getItem(‘token’) ? true : falseif (to.path == ‘/’) {next()} else {if (login) {next()} else {next({path: ‘/’,query: {redire...
2020-03-19 16:08:15 494
原创 vant适应终端设备
方案1:https://www.jianshu.com/p/8f9aab666c4a方案2:1.main.js// import ‘lib-flexible/flexible.js’2.build--------------》utils.js// const px2remLoader = {// loader: ‘px2rem-loader’,// options: {...
2019-10-25 09:32:36 259
原创 金额大写 尾部需要.00 而且还要带千位符
scriptdata () {return {text: ‘’,unit: new Array(“仟”, “佰”, “拾”, “”, “仟”, “佰”, “拾”, “”, “角”, “分”),}}methods:{toThousandsNoZero(num) {return num ? ( (isNaN(parseFloat(num.toStri...
2019-10-10 15:57:16 428
原创 金额带千位符,尾部需要.00
<el-input v-model=“ruleFormCard.money” class=“time-left” @blur=“projectAmounts”>// 金额尾部需要.00 而且还要带千位符toThousandsNoZero(num) {return num ? ( (isNaN(parseFloat(num.toString().replace(/,/g...
2019-10-10 14:00:20 561
原创 vue 首屏优化的解决方案
1.路由懒加载const workCircle = r => require.ensure([], () => r(require(’@/module/work-circle/Index’)), ‘workCircle’)const workCircleList = r => require.ensure([], () => r(require(’@/module/wo...
2019-08-16 16:30:14 197
原创 标准盒模型与IE模型写的区别
box-sizing属性是用来控制元素的盒子模型的解析模式,默认为content-boxcontent-box:w3c标准盒子模型,设置元素的height/width属性指的是content部分的高宽border-box:IE传统盒子模型,设置元素的height/width属性指的是border+padding+content部分的高宽...
2019-07-25 15:05:45 194
原创 radio点击选择点击传值1,0
<el-radio-group v-model="infoDate.sex" size="medium"> <el-radio :label="1" @click.native.prevent="clickitem(1)">男</el-radio> ...
2019-05-05 15:48:48 1196
原创 下拉的显示
<el-select v-model="open" placeholder="显示状态" @change="openEvent"> <el-option :value="2" label="是否显示"></el-option> ...
2019-05-05 15:45:23 197
原创 switch按钮的显示隐藏
<el-switch v-model="item.open" class="demoBtn" active-text="显示" inactive-text="隐藏"...
2019-05-05 15:40:30 1279
原创 vue表单的全选与反选
1.<input type=“checkbox” v-model=“checkAll” @change=“changeState”> ![在这里插入图片描述](https://img-blog.csdnimg.cn/20190505152441360.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVp...
2019-05-05 15:32:14 526
原创 h5常见的问题
###H5项目常见问题及注意事项####Meta基础知识:H5页面窗口自动调整到设备宽度,并禁止用户缩放页面//一、HTML页面结构// width 设置viewport宽度,为一个正整数,或字符串‘device-width’// height 设置viewport高度,一般设置了宽度,会自动解析出高度,可以不用设置// initial-scale 默认缩放比例,为一...
2019-05-05 15:14:59 112
原创 vue 全选与取消全选
vue 全选与取消全选所用知识点1 v-model:监听input内容2 watch:监听属性方法参考https://cn.vuejs.org/v2/api/#watch3 页面初始化调用函数 mounted一:html元素实现思路1 v-model 一个收集所有input(除全选框外)数组checkModel ,vue会动态将其checked为true的input的valu...
2019-05-05 15:12:16 248
原创 VUE+Webpack 实现懒加载的三种方式
{path: “路由路径”,component: () =>import(/* webpackChunkName: "chunk名称 用于代码分割 " */ “组件路径”)}第一种引入方式 就是正常的路由引入方式const router = new Router({routes: [{path: ‘/hyh’,component: hyh,name: ‘hyh’}...
2019-05-05 14:55:21 212
原创 小程序CSS实现单行和多行文本溢出显示省略号
1.单行省略号.textview{overflow: hidden;text-overflow: ellipsis;white-space: nowrap}2.多行省略号.textview{display: -webkit-box ;overflow: hidden;text-overflow: ellipsis;word-break: break-all;-webkit-...
2019-05-05 14:47:53 861
原创 rem与px的转化
方法1:方法2:(function(win,doc){function change(){doc.documentElement.style.fontSize = 100*doc.documentElement.clientWidth/375+‘px’;}change();win.addEventListener(‘resize’,change,false);})(window...
2019-05-05 14:44:32 340
原创 axios请求接口
1.非json格式var me=this;let fd = new FormData()fd.append(‘file’, f.file)fd.append(‘fid’,this.route.params.id);//传其他参数fd.append(′score′,this.fjscore);console.log(fd)me.route.params.id);//传其他参数 ...
2019-03-05 11:08:36 1037
原创 ¶element-ui 递归出来的el-checkbox实现全选和反选
1.~版本handleCheckAllChange(event) {this.checkedCities = event.target.checked ? cityOptions : [];this.isIndeterminate = false;},2.0版本的是boolean值handleCheckAllChange(val) {this.checkedCities = val ...
2018-12-17 18:14:24 1069
原创 vue全屏显示,esc退出
项目中有要实现全屏的需求,而且全屏和非全屏的状态有差异。1、项目中使用的是sreenfull插件,执行命令安装npm install --save screenfull2、安装好后,引入项目,用一个按钮进行控制即可,按钮方法如下:toggleFullscreen() {if (!screenfull.enabled) {this.$message({message: ‘you bro...
2018-12-09 14:45:22 4998 4
原创 Element ui日期转为"yyyy-MM-dd"
一般情况下,我们需要给后台的时间格式是:“yyyy-MM-dd”但是使用Element ui日期选择器获取的值是这样的:Fri Sep 22 2017 00:00:00 GMT+0800 (中国标准时间)在官方文档中,有提到可以使用change<el-date-picker type=“date” v-model=“sTime” @change=“getSTime” format=...
2018-12-05 15:10:45 1381
原创 vue获取年月日 星期 时间
// 获取当前时间函数timeFormate(timeStamp) {let year = new Date(timeStamp).getFullYear();let month =new Date(timeStamp).getMonth() + 1 < 10? “0” + (new Date(timeStamp).getMonth() + 1): new Dat...
2018-11-19 15:40:39 7568
原创 vue 锚链接点击不更改url
或者<a href=“javascript:void(0)” @click=“goAnchor(’#comment’)”> goAnchor(selector) { var anchor = this.$el.querySelector(selector) document.body.s...
2018-11-15 17:18:54 966
原创 vue axios发送请求时,后台保存了session,获取不到数据
把默认配置withCredentials改为true,就可以允许跨域携带session信息了axios.defaults.withCredentials=true;这样每次发送ajax请求后,只要不关闭浏览器,得到的session数据都是一致的。...
2018-11-12 18:19:42 7157
原创 router.push(传参)跳转页面,参数改变,跳转页面数据不刷新
第一个是search组件search组件应用到indexSearch页面,解决跳转当前页面数据不更改,通过watch
2018-11-12 17:51:29 2269 1
转载 vue刷新页面
1、最直接整个页面重新刷新:location. reload()this.$router.go(0)这两种都可以刷新当前页面的,缺点就是相当于按ctrl+F5 强制刷新那种,整个页面重新加载,会出现一个瞬间的空白页面,体验不好2、新建一个空白页面supplierAllBack.vue,点击确定的时候先跳转到这个空白页,然后再立马跳转回来空白页supplierAllBack.vue里面...
2018-11-06 14:50:14 278
原创 **跨域问题:解决跨域的三种方案**
当前端页面与后台运行在不同的服务器时,就必定会出现跨域这一问题,本篇简单介绍解决跨域的三种方案,部分代码截图如下,仅供参考:方式一:使用ajax的jsonp前端代码服务器代码使用该方式的缺点:请求方式只能是get请求方式二:使用jQuery的jsonp插件插件下载网址:https://github.com/jaubourg/jquery-jsonp前端代码服务器代码使用该...
2018-11-02 18:31:44 150
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人