最近在做移动端项目时，需要实现一个列表页面的每一项item向左滑动时出现相应的删除按钮，本来想着直接使用zepto的touch.js插件，因为之前实现相同的功能时用过这个插件，当时还挺好用的，直接使用它的swipeLeft和swipeRight方法即可，可是今天又开始做这个功能时，却发现这两个方法在使用时毫无效果，一点反应都没有。上网查资料，又下载了最新版本的zepto和touch.js，都没有用，也不知为什么？所以就弃用了这个插件。 阅读全文
在微信浏览器中浏览页面时，在当前页面中当我们将页面往下滚动到某一个位置时，可能我们就会点击某个链接而页面跳转到了另外一个页面，而当我们又返回到上一个页面时我们会发现那个页面还停留在我们之前浏览的位置，很方便我们接着往下浏览页面上其他的信息，这种效果大大提升了用户的体验度，提升了网站的逼格。今天，我就把实现这种效果的原理和代码分享给大家，方便大家的开发使用。
**原理**
1、用户滚动页面时，记录滚动条距离页面顶部的距离scrollTop；
2、将记录的值保存到cookie；
3、在返回到上一页时，再将保存到cookie中那个值赋值给上一页的滚动条距离顶部的距离scrollTop即可。 阅读全文
问题分类
滑动屏幕打开相应功能操作。
问题描述
1、用户手动滑动屏幕，根据滑动的方向，打开相应的功能（如：向上滑摇钱树经验明细，向下滑打开任务明细，向左滑打开聚宝盆物品查看等功能），滑动事件捕获问题。
2、大家都知道，划动都有角度问题，如：向330度方向滑动手机，要计算出它的方向问题。
3、HTML5提供的滑动事件，只能读取到起点和终点坐标，计算角度问题。
4、手机屏幕坐标与标准坐标系转换问题。
解决方案
1、滑动屏幕事件使用Html5 的touchstart滑动开始事件和touchend滑动结束事件。
2、方向的判断，以起点做平面坐标系，与终点连线做直线，直线与x正半轴计算角度；我们以45度角为方向分割线，如：只要滑动角度大于等于45度且小于135度 阅读全文
我们平时在看一些选秀节目或一些歌唱类比赛节目时经常会看到在现场的大屏幕上会有观众的手机号在滚动来选出谁是幸运观众或谁中了什么奖项，这些手机号都是现场观众或场外观众在给选手投票时产生的，当主持人一声开始令下，大屏幕上的手机号就会快速随机滚动，当主持人一声停令下，大屏幕上会随机出现几个停止滚动的手机号，这种手机号批量随机滚动的效果，就是我们今天要实现的效果。*注意*，在这个效果的实现当中最核心的就是随机和不重复。
下面，我就简单来介绍一下原理：
1、随机，我们要写一个随机数，而且这个随机数不能重复，这个不能重复的随机数说白了就是我们从数据库中取出的手机号的索引；
2、使用定时器不断的产生不重复的随机数 阅读全文
以前实现移动端的滑动加载更多实现的方法是当滚动条快到页面底部时就自动加载更多的数据，在这方面很多人都用的是"西门的后花园"写的一个叫[dropload](https://github.com/ximan/dropload)的插件，这个插件用起来也很好，很感谢西门的后花园作者。我以前在项目中用的也是这个插件，后来我老大说能不能做成那种向上拖动才会加载更多的效果，不要这种滚动到底部就加载，于是我就使用了iscroll 阅读全文
今天在做H5的水平滑动卡片时用到了`display:inline-block;`却发现处在同一水平线上的元素之间居然产生了缝隙，这很显然不是我想要的效果，所以我就换成了左浮动，这样缝隙的问题是解决了，但是需要设置父元素的宽度才能实现水平左右滚动，这样又增加了代码量，因为卡片的个数不固定，需要实时设置其父元素的宽度，就要用到js，所以代码量增加了，也不是最好的选择。看来最好的解决办法就是用到`display:inline-block;`了，于是缝隙的问题就出现了。 阅读全文
**十进制转换为二进制：**
```js
var num = 100;
console.log(num.toString(2));
```
toString()方法可把一个 Number 对象转换为一个字符串，并返回结果。
**语法**
```
NumberObject.toString(radix);
```
其中，radix为可选。规定表示数字的基数，使 2 ~ 36 之间的整数。若省略该参数，则使用基数 10。但是要注意，如果该参数是 10 以外的其他值，则 ECMAScript 标准允许实现返回任意值。 阅读全文
以下为js获取HTTP的全部请求头信息：
```js
var req = new XMLHttpRequest();
req.open('GET', document.location, false);
req.send(null);
var headers = req.getAllResponseHeaders().toLowerCase();
console.log(headers);
```
以下为js获取HTTP的部分请求头信息，如日期：
```js
var req = new XMLHttpRequest();
req.open('GET', document.location, false);
req.send(null);
var headers = req.getResponseHeader('date');
console.log(headers); 阅读全文
之前，我介绍了学习安装并配置前端自动化工具Gulp，觉得gulp确实比grunt的配置简单很多，于是我决定再深入学习一下gulp，就去网上查了资料，发现gulp还可以自动添加版本号，这个功能就为我平时在更新css或js时老是在客户端存在缓存导致更新后的效果无法实时展现的苦恼。所以就赶紧去试了一下，果真可以，很高兴啊，真是为项目开发，为效果的快速展现提供了很多的便利。
实现原理：
1、修改js和css文件；
2、通过对js,css文件内容进行hash运算，生成一个文件的唯一hash字符串(如果文件修改则hash号会发生变化)；
3、替换html中的js,css文件名，生成一个带版本号的文件名。 阅读全文
