![](https://img-blog.csdnimg.cn/20201014180756930.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
web前端大杂烩
不破小子
这个作者很懒,什么都没留下…
展开
-
教你如何读取一个目录的json文件,然后转化地理坐标,并下载
1.利用require.context读取某个目录的json文件的内容 function dynamicImportData(){ const context = require.context('./data',true,/\.json$/); // 遍历所有 const tempDataLst = []; let dataList = []; context.keys().forEach((item)=>{ tempDataLst.pus原创 2021-05-27 17:33:57 · 672 阅读 · 0 评论 -
前端疑问
1.inline-block造成空白实例:制作水平导航栏的思路 1.1使用浮动,缺点需要清除浮动; 1.2使用inline 1.3使用inline-block,会造成空白,为什么?原创 2016-08-16 11:52:35 · 333 阅读 · 0 评论 -
关于javascript "use strict"的学习
关于javascript “use strict”的学习参考资料:阮一峰http://www.ruanyifeng.com/blog/2013/01/javascript_strict_mode.html原创 2016-08-28 21:50:55 · 343 阅读 · 0 评论 -
hack IE
转载 2016-11-03 14:50:29 · 707 阅读 · 0 评论 -
关于伪元素和伪类
转载 2016-11-03 14:49:03 · 691 阅读 · 0 评论 -
前端水平居中以及垂直居中方法积累
1.水平居中1.1已知宽度块元素宽度 :.child{width:1000px;margin:0 auto;}1.2文本内容居中:.parent{text-align:center;}1.3通过表格:.child{display:table;margin:0 auto;}1.4已知宽度,通过设置position:absolute,margin-left为宽度的负一半.parent{positi原创 2016-11-30 17:45:30 · 15506 阅读 · 4 评论 -
关于html标签语义化
最近,去面试了凡科,凯哥问了我一个看似很简单但是我却答不上的问题,谈谈你对“html标签语义化的了解“?我只能根据我所了解的,比如html5的新特性,像”nav“,"header","footer"这些标签相比div,span,能够更直观地表达出他们的涵义,此外,我曾经看过一本书《编写高质量代码》一节介绍,当去掉CSS文件时,页面还能表现良好,才是符合标签语义化的。。。 之后,我在网原创 2016-03-02 17:37:23 · 427 阅读 · 0 评论 -
localStorage实现本地储存(永久性的,再木没有删除情况下)
1.假如我需要对从后台请求到的json数组进行本地存储,然后以后就可以减少ajax请求,我是这么做的: var resultData;//本地储存 if(typeof(window.localStorage.localPrizeData)=="undefined"){ getTurntableData(); }原创 2016-10-12 15:18:46 · 6218 阅读 · 1 评论 -
实现复选框,单选框附加上美图并实行动画思路分析
1. XXXXXX 实现思路: (1)在input设置id,然后在label标签设置for属性指向input的id; (2)将复选框设置为display:none,input[type="checkbox"]{display:none;} (3)在label标签以内实现具体的图片或者内容(用xxxx代替) (4)当复选框为checked状态下实现label原创 2016-09-12 16:03:15 · 725 阅读 · 0 评论 -
scroll事件在微信安卓端的研究
该需求在chrome调试模式下的手机以及oppo安卓手机自带浏览器、ios微信端滑动很流畅,但是在安卓微信端scroll事件有点延迟,怎么办原创 2016-12-07 11:35:42 · 2454 阅读 · 0 评论 -
高性能javascript技巧
1.document.createDocumentFragment2.变量缓存,避免原型链查找参考资料:Web性能优化系列:10个提升JavaScript性能的技巧 JavaScript DocumentFragment:更快捷的操作DOM的途径原创 2016-12-06 17:29:11 · 541 阅读 · 0 评论 -
前端黑魔法之css3以及h5
1.对于超出文本域的文字处理,使用省略号处理(属于css3属性): overflow:hidden; text-overflow:ellipsis; -o-text-overflow:ellipsis; white-space:nowrap; width:100%;原创 2016-02-29 14:10:51 · 998 阅读 · 0 评论 -
常用插件
1.播放器ckplayer2.百度地图BaiduMap3.百度编辑器ueditor4.laryer弹窗处理5.number_jump数字跳动6.uploadify3.1上传插件原创 2016-02-29 14:12:23 · 438 阅读 · 0 评论 -
css3实现冲击波效果
近日,很多浏览器按钮点击会出现以下冲击波效果,出于好奇,参考网上的资料,将这个效果研究实现下。 实现思路:观察波由小变大,涉及的css3属性变化有width,height,left,top,opacity,首先通过伪类实现冲击波层,同时需要设置冲击波前后的中心点位置(这里涉及一点点数学知识:画图计算两个点的位置),最后设置transition-duration: 0实原创 2016-11-07 15:33:06 · 1998 阅读 · 0 评论 -
如何在interlliJ IDEA上配置tomcat
1.先安装好jre和jdk2.在interllij IDEA右上角上单击击“Edit Configurations”,弹出框 在弹框的左上角点击绿色的“+”之后,添加local的tomcat Server 3.参考文章:http://tanghenxin.blog.163.com/blog/static/213511105201502211953297/原创 2016-06-02 17:46:13 · 847 阅读 · 0 评论 -
H5上传图片和获得图片关键代码
var imgObject=document.getElementById("selectPhoto");//定义读取文件的io流var imgReader=new FileReader();//验证图片的正则表达式var imgTest=/^(?:image\/bmp|image\/cis\-cod|image\/gif|image\/ief|image\/jpeg|image\/jpe原创 2016-04-19 16:07:40 · 3746 阅读 · 1 评论 -
prefixfree.min.js插件的了解
该插件可以让前端开发者在写css3时不用写浏览器前缀名,下载处请戳:http://leaverou.github.com/prefixfree/,该插件也有弊端,对于一些不支持或者禁用js的浏览器用户是很不友好的,很可能会打乱布局原创 2016-05-03 14:25:34 · 4509 阅读 · 0 评论 -
仲享登录界面html 采用table实现布局
欢迎来到仲享DIY用户登录:用户注册密 码:找回密码 &nb原创 2014-10-27 19:13:14 · 2139 阅读 · 0 评论 -
css优先级别
http://www.cnblogs.com/52css/archive/2012/06/07/2540550.html;http://blog.sina.com.cn/s/blog_6dbaeb9b0100wyu8.html;转载 2016-03-02 18:15:55 · 345 阅读 · 0 评论 -
前端性能之懒加载
转载: http://www.cnblogs.com/flyromance/p/5042187.html; http://www.2cto.com/kf/201401/273784.html http://stylechen.com/imglazyload2.html http://www.daxueit.com/ar原创 2016-03-18 00:02:37 · 371 阅读 · 0 评论 -
强悍的css3媒体查询打印页面
如何根据需要打印页面的内容:思路1:先用个临时变量获取body的html内容,然后自定义个变量将想打印的内容放到""中,再将该变量赋值给document.body.innerHTML,随后执行 window.print();打印出来内容是OK的,但是样式这块就有问题,因为样式可能是动态生成;思路2:用css3 @media print{原创 2016-03-23 15:20:36 · 1127 阅读 · 0 评论 -
Sublime Text3常用快捷键
Ctrl+D 选词 (反复按快捷键,即可继续向下同时选中下一个相同的文本进行同时编辑)Ctrl+G 跳转到相应的行Ctrl+J 合并行(已选择需要合并的多行时)Ctrl+L 选择整行(按住-继续选择下行)Ctrl+M 光标移动至括号内开始或结束的位置Ctrl+T 词互换Ctrl+U 软撤销Ctrl+P 查找当前项目中的文件和快速搜索;输入 @ 查找文件主标题/函数;或者原创 2016-02-29 13:55:09 · 432 阅读 · 0 评论 -
js实现快捷键绑定按钮点击事件
document.onkeydown= function (e) {var theEvent = window.event || e; var code = theEvent.keyCode || theEvent.which; if (code == 13) { $("#uWorkplaceContent .btn-search").click(); }}原创 2016-02-29 13:57:24 · 2475 阅读 · 0 评论 -
教教你不用table制作出表格
.results-ul{float:left;width:100%;text-align:center;margin:20px auto;} .results-ul>li{width:100%;float: left;margin:0 auto;border-bottom:1px solid #fff;}.results-ul>li span{display:inline-block;fl原创 2016-02-29 14:00:17 · 3318 阅读 · 1 评论 -
come on,make a date progress bar together!
.loading{text-align:center;width:800px;height:30px;border-radius:15px;background:#a0a0a0;margin:10px auto;position:relative;}.loading>div{width:180px;height:30px;border-radius:15px;background:#01AAE原创 2016-02-29 14:04:31 · 419 阅读 · 0 评论 -
获取客户端的cookie
function getCookie(c_name){if(document.cookie.length>0){c_start = document.cookie.indexOf(c_name+'=');if(c_start != 1){c_start = c_start + c_name.length+1;c_end = document.cookie.indexOf("转载 2016-02-29 14:05:51 · 1247 阅读 · 0 评论 -
SEO优化篇——meta用法
一、语法: 二、参数解析:1)name选项:Keywords(关键字),description(网站内容描述),author(作者),robots(机器人向导)等等 2)http-equiv项:可用于代替name项,常用的选项有Expires(期限),Pragma(cache模式),Refresh(刷新),Set-Cookie(cookie设定),Window-target(显原创 2016-02-29 14:07:26 · 874 阅读 · 0 评论 -
设置网页地址栏小图标
显示在地址栏最前面的小图标支持iphone,ipad原创 2016-02-29 14:09:35 · 2574 阅读 · 0 评论 -
前端错误知识提示积累
1.jquery ajax的error报错:parseerror:可能变量位置不对;2.jquery多次滥用会导致bootstrap modal弹窗关闭时,dropback依旧存在;3.bootstrap的modal弹窗如果同时存在手动$().modal()和data-toggle="#",data-target="#",页面会出现一弹窗就消失;原创 2016-02-29 14:13:56 · 479 阅读 · 0 评论 -
解决js 出现乱码问题
最近在webstorm上做开发,一运行页面,js文件总会出现问题,排除了页面没有“utf-8”以及文件目录问题,剩余的唯一性,就是编辑器设置的问题,稍后在webstorm上进行设置的修改,file---》setting---》File encodings,很重要一点,就是要重新启动webstorm原创 2016-03-28 14:11:21 · 656 阅读 · 0 评论 -
qrcode生成二维码,canvas转化为图片
可以用jquery.qrcode.min.,js将一个页面生成二维码,该插件支持canvas和table,默认为canvas核心代码: $('#qrcodeCanvas').qrcode({ width:150, height:150, text:"http://www.o-home.com/select/print" })原创 2016-03-28 14:52:51 · 24122 阅读 · 1 评论 -
CSS样式实践篇
今早,借助《DIV+CSS3.0网页布局案例精髓》原创 2014-08-14 17:01:26 · 494 阅读 · 0 评论