2022年9月29日
文字图片flex布局一行居中后要微调文字高度
摘要： 文字图片flex布局一行居中后要微调文字高度 采用设置padding或者margin的方式不可行，会往外扩 可以设置文字的line-height来调整文字和图片的相对高度 阅读全文
posted @ 2022-09-29 19:49 jiazq 阅读(104) 评论(0) 推荐(0)
CSS空心箭头
摘要： 使用before和after伪类实现空心箭头 // 主要利用before和after的边框实心箭头，通过绝对定位覆盖完成看上去像空心箭头的设计 .dom { display: inline-block; position: relative; &::before, &::after { conten 阅读全文
posted @ 2022-09-29 19:47 jiazq 阅读(157) 评论(0) 推荐(0)
2022年9月5日
H5 键盘弹出把底部固定定位的元素挤上来
摘要： 这里的解决方法是安卓监听窗口高度，iOS监听文本块焦点，以实现隐藏与显示底部固定定位元素 // 以下为vue2的写法 // originHeight为窗口高度，当键盘弹出时，android手机会改变，监听变化控制下方固定按钮是否显示 // ios手机input框聚焦键盘弹出，键盘收起时，input框 阅读全文
posted @ 2022-09-05 21:18 jiazq 阅读(580) 评论(0) 推荐(0)
axios在接口获取到值后再判断逻辑
摘要： 需求：代码逻辑需要axios调接口返回后根据具体值再做判断 一个流程需要调多个接口判断执行，axios不提供同步执行 // await后面的Promise可以改为需要调用的接口，通过接口的返回值赋值给resolveValue，最后返回Promise包裹的resolveValue // 条件1 asy 阅读全文
posted @ 2022-09-05 21:14 jiazq 阅读(78) 评论(0) 推荐(0)
折叠面板
摘要： 在使用的组件库中没有折叠面板或者不好用时，可以采用以下方法实现自定义样式 第二个JS为一个vue组件，直接用该组件包裹可能显示和隐藏的内容，第一个JS为简单的使用介绍，被包裹的内容在judge控制隐藏显示时会自动展开收起 import collapseC from 'xxx路径' changeJud 阅读全文
posted @ 2022-09-05 21:11 jiazq 阅读(54) 评论(0) 推荐(0)
父子多重展开折叠联动
摘要： 用对象控制父与子的展开折叠 const isShowCard = { card1: { value: true, // 父 subCard1: true, // 子1 subCard2: true // 子2 }, card2: { value: true, // 父 subCard1: true, 阅读全文
posted @ 2022-09-05 21:09 jiazq 阅读(38) 评论(0) 推荐(0)
计算文本占用的行数
摘要： 计算文本要占用多少行 // 使用document.createRange()计算文本行数，实际length会比行数多一 const range = document.createRange() range.selectNode(document.getElementById('domRef')) / 阅读全文
posted @ 2022-09-05 21:08 jiazq 阅读(49) 评论(0) 推荐(0)
H5 添加左划删除手势
摘要： 添加左划删除手势 // 添加左划手势，通过添加swipeleft类实现 addSwipeLeft() { // 侧滑显示删除按钮 var expansion = null // 是否存在展开的list var container = document.getElementById('shopCard 阅读全文
posted @ 2022-09-05 20:57 jiazq 阅读(307) 评论(0) 推荐(0)
图片动画旋转180度
摘要： 通过添加类名实现旋转180度 .beginCSS{ transform: rotate(0deg); transition: transform ease 0.5s; } .endCSS{ transform: rotate(-180deg); transition: transform ease 阅读全文
posted @ 2022-09-05 20:56 jiazq 阅读(119) 评论(0) 推荐(0)
加入购物车抛小球和购物车晃动
摘要： 抛出小球加到地方对应元素晃动(加入购物车动画) /* * 添加到购物车动画 脚本，涉及到键盘弹出时，动画需要延迟100ms执行，以保证键盘已经弹回去，页面元素位置不变 * */ /** * * 动画轨迹控制 * @param addBtnDom 增加按钮的dom元素或者选择器 * @param sh 阅读全文
posted @ 2022-09-05 20:55 jiazq 阅读(52) 评论(0) 推荐(0)