问题记录
我还记得那天夕阳下的奔跑
前端小白
展开
-
软键盘弹出影响webapp中固定定位的问题
最近用html做app时,在修改密码页面弹出的软键盘将固定在页面底部的按钮顶上来了,导致布局有一定的混乱。我查阅了相关资料解决此问题。这里做一个记录。原因:某些安卓机下键盘弹起会引起窗口高度(html标签的高度)变小,而fixed定位是相对于html根元素的,所以会被顶上来。如下图: html如下:<body><div class="container h...原创 2017-11-16 14:24:05 · 2636 阅读 · 0 评论 -
IE9中table出现空白单元格及td出现错位的问题
问题描述:最近做的项目中,PC端页面有大量的table。某些页面的table列数较多(20列左右),在IE9浏览器中部分表格单元格分割线显示不全,同时存在数据显示错位。如下图所示:原因:经排查,发现是换行引起的,即<tr><td></td><td></td></tr>不能换行。解决办法:找一个在线HTML压缩,将表格插件中 t...原创 2018-03-12 17:42:34 · 1523 阅读 · 0 评论 -
页面加载时,添加进度条,提高用户体验
这几个月做了个项目,在此对一些问题做一个记录。项目是前后端分离的,前端用的 npm+webpack。问题:由于系统某页面数据量过大或网络较差等原因,导致页面还未完全加载出来,但按钮已被加载时(js还未就绪),点击按钮会报错。根据系统情况,解决方案:每个页面加载的时候,在header上方加一个动态的进度条,同时通过css样式在页面上覆盖一个透明的背景,使页面在加载完成前不可点击。页面完全...原创 2018-03-22 16:01:34 · 2564 阅读 · 0 评论 -
src=' ' 致webpack打包报错
今天同事遇到代码打包报错,从main.js -> js -> css -> html 排除错误。找了几个小时后,将错误定位到图1所示代码: 图1报错详情如图2所示:(这个报错无法帮助我们定位错误) ...原创 2018-03-19 17:31:12 · 262 阅读 · 0 评论 -
IE9兼容placeholder
最近做项目发现IE9不支持placeholder属性,故而做兼容,在此做一个记录。解决方案:先检查浏览器是否支持placeholder属性,如果支持,则不做处理;如果不支持,且placeholder有值的情况下,生成一个label标签覆盖在原来input的位置,然后再根据input的情况对label标签显示或隐藏。效果如下图:demo如下(由于宽度有限,对某些代码做了换行处理):...原创 2018-03-23 18:15:50 · 293 阅读 · 0 评论