May
12
时光不会遗弃努力的人，但也不一定会带努力的人一起快乐的玩耍
好吧，说人话，我遭遇中年危机了
干着平凡枯燥没有前途的工作，拿着刚够养家糊口的薪水，感觉遇到一道瓶颈，等待突破的时刻
…………
好吧，说人话，我遭遇中年危机了
干着平凡枯燥没有前途的工作，拿着刚够养家糊口的薪水，感觉遇到一道瓶颈，等待突破的时刻
…………
May
12
vue模块化开发入门| 从0到1——使用vue.js2.0 + ElementUI开发BS后台管理系统
技术选型：
基于vue2.0脚手架的搭建
elementUI 框架 element-cn.eleme.io/#/zh-CN/com…
vueX状态管理
axios —— http封装+拦截器的使用
vue-router 路由使用
webpack简单配置
ES6语法
inconfont 矢量图应用
https://juejin.im/post/5ae3da516fb9a07a9e4cf7a8?utm_source=gold_browser_extension
技术选型：
基于vue2.0脚手架的搭建
elementUI 框架 element-cn.eleme.io/#/zh-CN/com…
vueX状态管理
axios —— http封装+拦截器的使用
vue-router 路由使用
webpack简单配置
ES6语法
inconfont 矢量图应用
https://juejin.im/post/5ae3da516fb9a07a9e4cf7a8?utm_source=gold_browser_extension
May
12
git clone https://github.com/freedomdebug/vue-element1.0.git
报错
解决
cd 目录
git init
git config http.postBuffer 524288000
git clone https://github.com/freedomdebug/vue-element1.0.git
搞定
报错
解决
cd 目录
git init
git config http.postBuffer 524288000
git clone https://github.com/freedomdebug/vue-element1.0.git
搞定
Dec
8
html5中的GPS定位功能主要用的是getCurrentPosition， 该方法封装在 navigator.geolocation 属性里，是 navigator.geolocation 对象的方法。
getCurrentPosition()函数简介
getCurrentPosition(successCallback,errorCallback,positionOptions)
successCallback
表示调用getCurrentPosition函数成功以后的回调函数，该函数带有一个参数，对象字面量格式，表示获取到的用户位置数据。该对象包含两个属性 coords 和 timestamp。其中 coords 属性包含以下7个值：
accuracy：精确度
latitude：纬度
longitude：经度
altitude：海拔
altitudeAcuracy：海拔高度的精确度
heading：朝向
speed：速度
errorCallback
和 successCallback 函数一样带有一个参数，对象字面量格式，表示返回的错误代码。它包含以下两个属性：
1、message：错误信息
2、 code：错误代码。
其中错误代码包括以下四个值：
1、UNKNOW_ERROR：表示不包括在其它错误代码中的错误，这里可以在 message 中查找错误信息
2、PERMISSION_DENIED：表示用户拒绝浏览器获取位置信息的请求
3、 POSITION_UNAVALIABLE：表示网络不可用或者连接不到卫星
4、TIMEOUT：表示获取超时。必须在options中指定了timeout值时才有可能发生这种错误
positionOptions
positionOptions 的数据格式为JSON，有三个可选的属性：
1、enableHighAcuracy — 布尔值： 表示是否启用高精确度模式，如果启用这种模式，浏览器在获取位置信息时可能需要耗费更多的时间。
2、timeout — 整数： 表示浏览需要在指定的时间内获取位置信息，否则触发errorCallback。
3、maximumAge — 整数/常量： 表示浏览器重新获取位置信息的时间间隔。
getCurrentPosition()函数定位应用
点击按钮，就可以回提示是否获取当前位置，允许之后，可以获取你所在位置的经纬度！
getCurrentPosition()函数简介
getCurrentPosition(successCallback,errorCallback,positionOptions)
successCallback
表示调用getCurrentPosition函数成功以后的回调函数，该函数带有一个参数，对象字面量格式，表示获取到的用户位置数据。该对象包含两个属性 coords 和 timestamp。其中 coords 属性包含以下7个值：
accuracy：精确度
latitude：纬度
longitude：经度
altitude：海拔
altitudeAcuracy：海拔高度的精确度
heading：朝向
speed：速度
errorCallback
和 successCallback 函数一样带有一个参数，对象字面量格式，表示返回的错误代码。它包含以下两个属性：
1、message：错误信息
2、 code：错误代码。
其中错误代码包括以下四个值：
1、UNKNOW_ERROR：表示不包括在其它错误代码中的错误，这里可以在 message 中查找错误信息
2、PERMISSION_DENIED：表示用户拒绝浏览器获取位置信息的请求
3、 POSITION_UNAVALIABLE：表示网络不可用或者连接不到卫星
4、TIMEOUT：表示获取超时。必须在options中指定了timeout值时才有可能发生这种错误
positionOptions
positionOptions 的数据格式为JSON，有三个可选的属性：
1、enableHighAcuracy — 布尔值： 表示是否启用高精确度模式，如果启用这种模式，浏览器在获取位置信息时可能需要耗费更多的时间。
2、timeout — 整数： 表示浏览需要在指定的时间内获取位置信息，否则触发errorCallback。
3、maximumAge — 整数/常量： 表示浏览器重新获取位置信息的时间间隔。
getCurrentPosition()函数定位应用
点击按钮，就可以回提示是否获取当前位置，允许之后，可以获取你所在位置的经纬度！
Dec
8
对于手机网站建设，总结了如下几点注意：
1、 安卓浏览器看背景图片，有些设备会模糊。
用同等比例的图片在PC机上很清楚，但是手机上很模糊，原因是什么呢？
经过研究，是devicePixelRatio作怪，因为手机分辨率太小，如果按照分辨率来显示网页，这样字会非常小，所以苹果当初就把iPhone 4的960640分辨率，在网页里只显示了480320，这样devicePixelRatio＝2。现在android比较乱，有1.5的，有2的也有3的。
想让图片在手机里显示更为清晰，必须使用2x的背景图来代替img标签（一般情况都是用2倍）。例如一个div的宽高是100100，背景图必须得200200，然后background-size:contain;，这样显示出来的图片就比较清晰了。
代码可以如下：
background:url(../images/icon/all.png) no-repeat center center; -webkit-background-size:50px 50px; background-size: 50px 50px;display:inline-block; width:100%; height:50px; 或者指定 background-size:contain;都可以，大家试试！
2、图片加载
若您遇到图片加载很慢的问题，对这种情况，手机开发一般用canvas方法加载：
具体的canvas API 参见：http://javascript.ruanyifeng.com/htmlapi/canvas.html
下面举例说明一个canvas的例子：
<li><canvas></canvas></li> s动态加载图片和li 总共举例17张图片！
var total=17; var zWin=$(window); var render=function(){ var padding=2; var winWidth=zWin.width(); var picWidth=Math.floor((winWidth-padding*3)/4); var tmpl =''; for (var i=1;i<=totla;i++){ var p=padding; var imgSrc='img/'+i+'.jpg'; if(i%4==1){ p=0; } tmpl +='<li style="width:'+picWidth+'px;height:'+picWidth+'px;padding-left:'+p+'px;padding-top:'+padding+'px;"><canvas id="cvs_'+i+'"></canvas></li>'; var imageObj = new Image(); imageObj.index = i; imageObj.onload = function(){ var cvs =$('#cvs_'+this.index)[0].getContext('2d'); cvs.width = this.width; cvs.height=this.height; cvs.drawImage(this,0,0); } imageObj.src=imgSrc; } } render(); 3、假如手机网站不用兼容IE浏览器，一般我们会使用zeptojs。zeptojs内置Touch events方法，具体可以看http://zeptojs.com/#Touch events
看了一下zeptio新版的API，已经支持IE10以上浏览器，对zeptojs可以选择使用！
