- 博客(22)
- 收藏
- 关注
原创 input输入小数点后一位(兼容火狐)
function clearNoNum(e) { if (e.value != "" && e.key == '.' && -1 == e.value.indexOf('.')) { //兼容火狐,数字输入框输入点 value 值自动隐藏‘.’,再进行正则会丢失‘.’ ...
2019-10-21 13:21:22
540
原创 遮罩层禁止滚动
移动端经常遇到弹出层,为了凸显弹出层会加一个遮罩层例如下图遮罩层的样式<div class="mask"></div>.mask{ width:100vw; height:100%; background-color:rgba(0,0,0,0.5); position: fixed; top:0; left:0; display:non...
2019-03-18 16:25:41
2013
原创 获取验证码倒计时效果
html部分<input type="number" class="form-control mar phone1" placeholder="请输入手机号"><div style="position: relative;"> <input type="number" class="form-control mar
2019-03-18 16:06:05
382
原创 iframe,object,embed标签嵌入视频后 宽高度自适应的css技巧
此方法有效http://www.xiaoyunhua.com/2344.html
2019-03-18 15:59:11
3480
1
原创 图片路径错误时不显示
在image的src为空或者错误的时候会显示图标,这个问题ios的没有,安卓的有,例如下图 我用的框架是angular,给图片一个err-src<img class="tit" src='{{urlroot}}{{turl}}' err-src="http://google.com/favicon.ico"/>Directive返回空白a...
2019-01-22 16:40:53
807
原创 移动端弹出软键盘导致input光标错位问题
移动端页面的定位会影响光标位置,相信很多人都遇到过,然而在整个页面没有用到定位的情况下还是遇到了光标错位的问题。 原因是移动端在点击input输入的时候软键盘弹出,整个页面被键盘往上挤压,然而光标的位置也被挤压,收起软键盘的时候页面恢复,但是光标还是在原来i...
2019-01-22 16:28:24
4919
1
原创 highcharts的yAxis标题过长 分行显示
highcharts的yAxis标题过长加上这段就行啦labels: { formatter: function() { //获取到刻度值 var labelVal = this.value; //实际返回的刻度值 var reallyVal = labelVal; //判断刻度值的长度 if(labelVal.length > 2) { //截取刻度值...
2018-11-27 14:47:11
1724
原创 移动端页面踩坑合集
上周接的一个移动端的活动,那是一踩一个坑啊,在chrome和模拟器上调试没问题,但是你万万想不到,手机的型号怎么这么多,做好各设备的兼容将是各前端er的重要使命,且任重而道远。一、自适应布局在移动设备上进行网页的重构或开发,首先得搞明白的就是移动设备上的viewport,通读网上的各种对于viewport的解释之后大概viewport可以理解为三种1、layout viewport...
2018-10-22 11:38:46
577
原创 CSS3绘制3D盒子,动态害羞表情包
CSS3非常强大,我们不仅可以用它来绘制平面的图形,还可以绘制2D,3D的图形,并且可以制作一些动态的图,解锁CSS新玩法,今天要分享就是立体的3D盒子和动态超萌害羞表情包,先来看看效果附上完整的代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <
2018-08-03 10:40:36
1205
原创 原生JS实现富文本编辑器
富文本编辑器是我们常用到的编辑器,也有很多功能完备且强大的编辑器,比如Quill Rich Text Editor、ueditor等,都是很优秀的富文本编辑器。在我们写网页的时候也会用到它,通常省事的方法就是-------引用插件,但是有些插件的样式不是需求的样式,要修改插件的样式就比较麻烦,所以尝试自己写了一个。主要利用的是document.execCommand。先来看一下docume...
2018-07-26 14:00:48
14950
1
原创 改变SVG图的颜色
今早收到UI的icon文件夹,好多都是SVG的图,有些图标的颜色不是图稿中需要的颜色,那么这个时候怎么自己手动修改想要的颜色呢?首先,它原先的颜色长这样 我们先在SVG图上右击,用记事本打开,然后就会看到一堆东西,我们需要改的就是这部分:把#后面改成自己需要的颜色,然后另存为就可以了,不过这里要注意的是,不能另存为其他格式的后缀,只能是svg的,需要用到jpg或者其他格式...
2018-07-20 15:49:53
70526
4
原创 css绘制三角形,箭头,钻石,太极图,爱心等
先来看一下箭头,实现思路是一个正方形,两边border设置为transparent,再rotate,布局如下:<p>上箭头</p><div class="top"></div><p>下箭头</p><div class="bottom"></div&
2018-07-20 15:19:42
724
原创 什么是XSS攻击呢?
什么是XSS攻击呢?XSS攻击就是跨站脚本攻击 -Cross Site Scripting, 其实应该简称CSS攻击,但是这样会造成误会,以为是css层叠式样式造成了网站安全,所以改称为XSS攻击。一、跨站脚本攻击具体的攻击行为有哪些呢?1.通过脚本启动安装网页上危险的程序,从而造成用户电脑的安全性丧失,这种方式曾经是病毒的主要扩散形式2.通过脚本盗取用户cookie信息(docume...
2018-07-20 13:17:20
412
原创 搭建VUE脚手架(vue-cli)
确保node.js和npm/cnpm都安装好的情况下,查看命令:node -v/npm -v/cnpm -v,有返回版本号即为安装成功,npm和cnpm有一个即可,cnpm是淘宝镜像的npm,相对npm更快更稳定,配置命令:npm install -g cnpm --registry=https://registry.npm.taobao.org;vue安装在用 vue.js 构...
2018-07-20 13:16:36
206
转载 响应式设计——layout viewport、visual viewport以及相关属性
在阅读这篇文章之前,你需要了解设备像素、逻辑像素(设备独立像素)和CSS像素的区别layout viewportlayout viewport是网页布局的区域,它是<html>元素的父容器。只要你不在css中修改<html>元素的宽度,<html>元素的宽度就会撑满layout viewport的宽度。很多时候浏览器窗口没有办法显示出layout vi...
2018-07-20 13:10:18
1288
原创 VUE爬坑-----访问本地的文件拼接动态路径
Uploads为存放图片的文件夹,data存放拼接的url,设置为数组:data:function(){return{floag:"",list:'',imgs:[],url:[],}},在请求数据是对url进行拼接,且加上加上require,require为访问本地链接,这点和react一样,因为vue的url会被放在static内,不加...
2018-07-17 16:26:33
3998
原创 VUE爬坑------created请求数据产生的跨域问题
前端框架使用VUE, 后端为ThinkPHP3.2需要实现跨域请求。首先纠正一个误区:Vue的跨域代理并不是生产环境中需要的跨域解决方案所谓跨域问题是由XHR的浏览器安全设置引起,所以无论Vue多么强大,只要通过XHR,就无法避免跨域问题。所以Vue的跨域代理是由本地的node.js服务器转发请求,是一个本地化的环境,如果不存在这个环境,就没办法使用跨域代理来解决先看一下,普通的aja...
2018-07-17 16:24:48
1603
1
转载 JS变量声明和作用域
javascript的变量声明具有hoisting机制,JavaScript引擎在执行的时候,会把所有变量的声明都提升到当前作用域的最前面。先看一段代码 1 2 3 4 5 var v = "hello"; (function(){ console.log(v); var v = "world";...
2018-07-17 15:53:21
350
1
转载 圣杯布局、双飞翼布局、Flex布局和绝对定位布局
方法一:圣杯布局1.设置基本样式为了高度保持一致给left main right都加上min-height:130px。2.圣杯布局是一种相对布局,首先设置父元素container的位置: 实现效果是左右分别空出200px和300px区域,效果如图:3.将主体部分的三个子元素都设置左浮动出现了如下情况,怎么办,别着急慢慢来:4.设置main宽度为...
2018-07-17 15:47:21
693
转载 前端面试题及答案
javascript: JavaScript中如何检测一个变量是一个String类型?请写出函数实现typeof(obj) === "string"typeof obj === "string"obj.constructor === String请用js去除字符串空格?方法一:使用replace正则匹配的方法去除所有空格: str = str.replace(/\s*/g...
2018-07-17 14:42:58
843
转载 js中获取时间new date()的用法
var myDate = new Date();//获取系统当前时间myDate.getYear(); //获取当前年份(2位)myDate.getFullYear(); //获取完整的年份(4位,1970-????)myDate.getMonth(); //获取当前月份(0-11,0代表1月)myDate.getDate(); //获取当前日(1-31)myDate.getDay(...
2018-07-17 10:04:43
354
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人