![](https://img-blog.csdnimg.cn/20201014180756916.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端
二水你要努力啊
爆炸头, 望春风 。
展开
-
前端中常见的代码错误与Bug(持续更新中~~)
前端中常见的代码错误与Bug 若出现下行的块或文字被挤到后边去(尤其是插入列表时ul、ol、dl),则应考虑其上元素是否 错误或过多的设置了margin和padding。 若写了代码却没有效果,这时有两种可能的问题(均在开发者模式下查看): 第一种:在开发者模式下,若代码前出现了黄色的感叹号,并被用删除线包围,则应考虑此行 代码出现了拼写问题。 第二种:在开发者模式下,...原创 2019-03-04 09:47:36 · 3190 阅读 · 0 评论 -
自定义背景的进度条
在一个需要用到进度条的场景下,且背景是图片,可以利用裁剪功能来进行完成下面提供思路关键点在于rect(0px, params + ‘px’, 0px, 0px) 中的params位置不能写死,需要配合JS,或者Vue中的模板表达式来进行设置,提供后一种实现代码 <img src="./" :style="{ clip: rect(0px, ((currentNumber/tota...原创 2019-10-14 15:26:38 · 373 阅读 · 0 评论 -
工具类
格式化数字千分位 format(num) { var reg = /\d{1,3}(?=(\d{3})+$)/g return (num + '').replace(reg, '$&,') },限制输入框只能输入数字 oninput="value=value.replace(/[^0-9]/g,'')"...原创 2019-10-14 10:21:46 · 104 阅读 · 0 评论 -
Loadsh中的防抖
前提条件 **在给Vue中添加原生滚动条事件的时候出现了,出现了使用鼠标滚轮滑动时,再容器底部会抖出一部分距离** *在这一小部分距离即会,连续触发两次下拉加载函数* ![小范围抖动](https://img-blog.csdnimg.cn/20191012111801471.png) 此时,需要防抖限制一下, 在网上翻阅很多博客后,发现都是复制粘贴,并不好用,而loadsh提...原创 2019-10-12 11:24:28 · 1454 阅读 · 0 评论 -
使用下拉框,模拟单选框效果
踩坑较多,记录下来,分析坑点,填坑首先,数据由两个接口返回1、一个为选择框固定信息,以及选择框中的每个选项后面所跟的可以选填的输入框2、一个为用户选填的输入框信息其次,每个选择框所选中的值,不能出现重复项再者,可以动态添加选择框,内容默认展示条目内容,且不能重复,且上限为条目内容的上限最后,点击保存,刷新页面,需要回填参数(遍历接口数据,造出自己所需要的数据,之上同)...原创 2019-09-20 10:41:49 · 197 阅读 · 0 评论 -
图片防盗链问题
<meta name=referrer" content=“no-referrer” /> 防盗链" <meta name=referrer" content="no-referrer" />原创 2019-09-19 10:37:16 · 135 阅读 · 0 评论 -
自适应卡片布局要点
最重要的点便是媒体查询,与min-width和max-width(根据卡片内容是否可以完全撑起卡片来进行选择)配合float布局(Grid布局还未使用过,应该很好用)需要通过伸缩页面,观察flat布局的元素在哪个位置上发生掉落,即该点页面的可视区域宽度即为 媒体查询的宽度监听页面可视区域的代码 //加载页面时执行一次 changeMargin(); //监听浏览器宽度的改...原创 2019-09-16 11:13:25 · 917 阅读 · 0 评论 -
Questions
浮动问题 当浮动的元素过多时,可能会出现空白区域的问题,这时候,需要给浮动元素加一个高度,使其不被卡掉,而导致空白区域。原创 2019-09-12 16:41:47 · 120 阅读 · 0 评论 -
JS中的日期操作
一、当前天数加1 let date = new Date(); date.setDate(date.getDate() + days);通过setDate方法可以实现设置、获取未来某一天信息。原创 2019-08-12 09:52:38 · 343 阅读 · 0 评论 -
ES6
1.变量声明let 1.在ES6之前,我们都是用var关键字声明变量。无论声明在何处,都会被视为声明在函数的最顶部(不在函数内即在全局作用域的最顶部)。这就是函数变量提升例如: function aa() { if(flag) { var test = 'hello man' } else { console.log(test) ...转载 2019-07-22 07:49:17 · 101 阅读 · 0 评论 -
insertBefore 的详细用法解析
其中需要注意两点1.谁去调用此函数2.函数中的两个参数的意义原创 2019-04-23 11:14:46 · 6925 阅读 · 0 评论 -
计时器中的一个显示间隔问题
在得到了两个日期相减之后的值(以毫秒为单位)如果在之后以秒为单位显示,则在计时器的第二个参数后必须给小于 1000 的参数!且只要小于1000都可以正常显示秒数!若在 刚打开页面不使其延迟显示,则需要在计时器前,将要计时显示的内容先调用下,使其立即显示。此处最好将内容封装为函数(与上面代码重复),调用即可。...原创 2019-03-27 12:18:23 · 293 阅读 · 0 评论 -
关于渐变属性值的一些理解
首先,对于渐变(gradient)主要有两种方式,一种为线性渐变(linear-gradient),一种为径向渐(radical-gradient)本篇着重讨论线性渐变。渐变的语法:background: linear-gradient(direction, color-stop1, color-stop2, …);其中对于这个gradient轴也要有一定的了解(类似于弹性盒的主轴和副轴)...原创 2019-03-12 12:00:21 · 492 阅读 · 0 评论 -
对手机端布局的一些理解~~未完待续
前提,由于手机端的特性,灵活,更新快,各种型号,所以就有了以下特点:高度自适应且较PC端轻便简洁。重点:在写页面时,尤其是移动端页面,尤其要先搞清楚布局再下手。其中需要注意的一点就是,在基本三大块中,如果要写布局,一定要在其外面嵌套一层盒子,使其与外部的大框架不联系,这样在进行弹性盒变化时不会对其产生影响。(其中支付宝的头部与中部都用到了这个原理,而尾部由于一般是figure布局,其本身就是一...原创 2019-03-11 11:31:42 · 153 阅读 · 0 评论 -
手机端JS适配代码
手机端适配的通用代码,但要注意将640修改为设计稿的宽度,将从设计稿量得的mpx(m为量得长度),除以100后加上单位rem &lt;meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /&gt; &l原创 2019-03-14 10:10:47 · 2895 阅读 · 0 评论 -
CSS3实现简单的无缝轮播效果
CSS实现简单的无缝轮播效果 由于还没有接触到JS实现动态效果,但是比较想实现页面的简单轮播效果,翻了翻CSS标签,发现只有CSS3也可以实现动画效果,即通过animation动画标签,来实现动态的页面效果。以下是HTML模块&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;lt;!DOCTYPE html&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;gt;原创 2019-03-03 20:57:39 · 2125 阅读 · 0 评论