WEB前端
jun_h5
温柔可爱,为人诚恳且正直的媛妹妹。
展开
-
CSS3实现毛玻璃(图片模糊)效果
结合CSS3毛玻璃实现微信版的发红包看完整照片效果。可以完美的兼容移动端与PC端。原创 2016-02-27 16:29:25 · 28992 阅读 · 1 评论 -
前端SEO优化
首先了解什么是SEO?SEO(Search Engine Optimization)搜索引擎优化;SEO是指在了解搜索引擎自然排名机制的基础上,对网站进行内部及外部的调整优化,改进网站在搜索引擎中的关键词自然排名,获得更多流量,从而达到网站销售及品牌建设的目标。**为什么要SEO?**- 搜索流量质量高(投放精准,转化率高);- 性价比高;- 提高网站易用性。原创 2016-10-09 11:29:39 · 2083 阅读 · 1 评论 -
gulp安装那些事
在Gulp中,使用的是Nodejs中的stream(流),首先获取到需要的stream,然后可以通过stream的pipe()方法把流导入到你想要的地方,比如Gulp的插件中,经过插件处理后的流又可以继续导入到其他插件中,当然也可以把流写入到文件中。所以Gulp是以stream为媒介的,它不需要频繁的生成临时文件,这也是Gulp的速度比Grunt快的一个原因。1、安装gulp原创 2016-09-30 16:11:06 · 738 阅读 · 0 评论 -
关于js跨域JSONP的使用
跨域的间接意思是“同源策略”,也就是协议,域名,端口相同。如:http://www.aaa.com ——>> https://www.aaa.com 两个url协议不同其中 这些html标签支持跨域请求,然而jsonp也是利用了标签的跨域功能。一、jQuery:html页面需引入jqueryhttps://ss1.bdstatic.com/5eN1bjq8AAUYm原创 2017-02-08 15:40:26 · 571 阅读 · 0 评论 -
使用Git提交项目到gitHub上
关于gitHub小白使用git提交项目到gitHub的简单列举。原创 2016-04-13 17:14:08 · 856 阅读 · 0 评论 -
封装的一些 js, css使用小方法
参数拼接:hash或search的方法使用: var str = type; str = str.replace(/^\?/, '').split('#'); for (var i = str.length - 1; i >= 0; i--) { var keyValue = str[i].split('='); if (keyValue[0] == data) {原创 2017-10-01 10:16:41 · 457 阅读 · 0 评论 -
关于webpack项目的一些文件用途解析
我们经常在下载webpack构建的项目时会自动携带一些以 . 开头的文件,为了学习我对这些文件做了一点总结,仅供学习:.bablelrc.editorconfig.eslintrc.js.gitignore.gitreviewREADME.mdfavicon.ico.bablelrchttp://blog.csdn.net/zhanglongdream/article/details原创 2017-10-01 11:30:02 · 834 阅读 · 0 评论 -
略分析vue三大组件:vue-router/vuex/vue-resource用途
略解释vue三大组件用途:vue-routervuexvue-resourcevue组件通信vue-router:路由配置 https://router.vuejs.org/zh-cn/ 在APP.VUE文件里面使用来告诉router在哪里渲染$router.push()$router.replace()<router-link><router-view>vuex:状态管原创 2017-10-01 12:12:56 · 2041 阅读 · 0 评论 -
git提交命令行
表示git命令不会,真的很头疼,所以在用之前赶紧给自己补补吧。1、git安装1.1 配置git用户名与邮箱git config --global user.name "lizhangjun"git config --global user.email lizhangjun@huami.com--global只需要运行一次,已经保存在系统上配置文本编辑器如 vim原创 2016-09-30 16:05:17 · 365 阅读 · 0 评论 -
经纬度值绘制GPS轨迹图
需求:根据运动轨迹经纬度值,绘制无地图Path,效果如下。1. 在固定画布范围内绘制,不能超出;2. 因为运动公里数不相同,画出来的path大小不一,有可能超出画布范围内的情况,所以需要对所有数据统一处理规到固定范围内。 实现如下:1. 将经纬度比作x,y轴,为保证从x轴为0,y轴为0刻度开始绘制,使所有点规0,分别取出x,y轴的最小值,遍历所有经纬度取出xleast,yl...原创 2018-08-03 18:20:08 · 26883 阅读 · 2 评论 -
h5新特性--导航栏切换
在h5新特性出现前像类似这种Tab切换需要写一堆JS代码,但有了这个新特性后直接用h5标签即可实现切换。如下:<details> <summary>I am a title!</summary> <p>I am text.</p></details>剩下的样式就交给伟大的Css处理吧...原创 2018-08-03 18:57:56 · 2029 阅读 · 1 评论 -
各浏览器对document.body.onscroll,window.onscroll,document.documentElement.onscroll的兼容性
各浏览器对document.body.onscroll,window.onscroll,document.documentElement.onscroll的兼容性原创 2016-04-14 17:09:52 · 6522 阅读 · 0 评论 -
前端性能优化
移动端,首次加载同时请求数不能超过4个移动端的性能优化问题: 移动页面的速度跟三个因素有关,分别是:移动网络带宽速度,设备性能(CPU,GPU,浏览器),页面本身。1.图片加载 1)预加载,有两种实现方式:a.显性加载b.隐性加载加载第一张图片时,已经预先加载了第二张图片。 2)按需加载 先加载首屏,就是lazyload,滚屏加载原创 2016-10-07 00:07:10 · 486 阅读 · 0 评论 -
实现更高级的动画效果—requestAnimationFrame
我们一般用 H5 的transition和animations可能实现动画效果,但是高质量的动画效果及其流畅度都要求极致怎么办呢?原创 2016-02-27 18:32:58 · 453 阅读 · 0 评论 -
h5 canvas(toDataURL)实现将图片与文字结合
canvas.toDataURL实现将图片与文字结合。一般证件中输入的信息下载时与图片结合起来就是用的canvas的toDataURL()实现的。原创 2016-03-28 16:30:35 · 5666 阅读 · 2 评论 -
常用的正则表达式(RegExp)
前端正则表达式,验证表单事件。原创 2016-03-28 16:34:58 · 889 阅读 · 0 评论 -
js图片自动循环播放
js图片自动循环播放1.实现图片自动循环播放;2.单击数字按钮时跳转对应图片;3.左一张,右一张按钮单击时,显示相应的图片;原创 2016-05-24 22:49:45 · 11215 阅读 · 1 评论 -
前端交互开发微体验--总结了一些国内外炫酷的网站
前端交互开发微体验原创 2016-05-18 11:44:50 · 26812 阅读 · 4 评论 -
前端交互封装的一些javaScript方法
判断是否是手机,音乐播放,浏览器滚动事件,手机旋转事件,判断浏览器类型,判断设备类型原创 2016-05-23 14:13:25 · 1812 阅读 · 0 评论 -
跨域请求京东接口
我在跨域异步请求时踩到的坑,以及解决方法。原创 2016-06-16 16:02:04 · 2344 阅读 · 2 评论 -
由平面设计尸----->>转型到----->>WEB开发程序猿
其实现在有些设计师干一两年后都有想转行的想法,那我这个过来人就浅分享下转行体会吧原创 2015-08-25 16:29:25 · 670 阅读 · 0 评论 -
html中video视频播放
video播放时常见的问题。原创 2016-08-30 17:28:35 · 6514 阅读 · 0 评论 -
前端小技巧(一)
CSS常用的一些设置小技巧几乎经常用到原创 2016-05-18 11:50:51 · 779 阅读 · 0 评论 -
Parcel打包器应用经验分享
在大型项目中使用parcel打包工具后的心得,与踩过的坑。优点:1. 正如官网所说的快速,零配置的 Web 应用程序打包器事实确实这样,parcel比webpack更加轻量级,项目中用到的任何关于sass、less、图片、路径、及各种解析都是零配置,拿来即用型。只需要在package.json中引入对应的parcel、parcel-bundler,然后根据官网提示配置即可。...原创 2018-08-03 19:31:13 · 1372 阅读 · 0 评论