代码改变世界

在Gulp中使用BrowserSync

2016-02-24 23:47 by 那时候的我, 13577 阅读, 3 推荐, 收藏, 编辑
摘要:博客已迁移至 "http://zlwis.me" 。 很早就听说过BrowserSync,也看过一些相关文章,可就是没用过。之前一直在用Gulp开发项目,每次编写完Sass后还要用按 刷新页面看效果,想想也是够傻的,这么好用的东西竟然现在才开始用。 BrowserSync可以同时同步刷新多个浏览器, 阅读全文

解决iscroll.js上拉下拉刷新手指划出屏幕页面无法回弹问题

2016-02-17 23:52 by 那时候的我, 8588 阅读, 1 推荐, 收藏, 编辑
摘要:博客已迁移至 "http://zlwis.me" 。 使用过iscroll.js的上拉下拉刷新效果的朋友应该都碰到过这个问题:在iOS的浏览器中,上拉或下拉刷新时,当手指划出屏幕后,页面无法弹回。很多人因为解决不了这个问题,干脆就那样不解决了,还有的直接就不用HTML了,使用原生代替HTML页面。 阅读全文

纯CSS实现一个微信logo,需要几个标签?

2016-02-04 21:58 by 那时候的我, 6693 阅读, 29 推荐, 收藏, 编辑
摘要:博客已迁移至 "http://lwzhang.github.io" 。 纯CSS实现一个微信logo并不难,难的是怎样用最少的 标签实现。我一直在想怎样用一个标签就能实现,最后还是没想出来,就只好用两个标签了。 首先需要两个标签元素: 先画个背景: 再画个大的椭圆: 小的椭圆利用 的`::befor 阅读全文

hexo主题中添加相册功能

2016-01-17 19:22 by 那时候的我, 16469 阅读, 0 推荐, 收藏, 编辑
摘要:博客已迁移至 "http://lwzhang.github.io" 。 基本上所有的 主题默认都没有实现相册功能,一方面相册功能的需求较少,毕竟 主要是写博客用的;另一方面实现相册功能比较麻烦,比如说: 图片放哪里,放在 文件夹中,需要解析成静态文件,图片一旦多的话就会解析的非常慢 怎么... 阅读全文

babel无法编译?

2015-11-18 00:20 by 那时候的我, 5474 阅读, 1 推荐, 收藏, 编辑
摘要:`ECMAScript 6(ES6) ECMAScript 5(ES5) ES6 ES6`的新特性,还得等上一段时间。 对 的普及起到至关重要的就不得不说 了。 可以将 代码完美地转换为 代码,所以我们不用等到浏览器的支持就可以在项目中使用 的特性。 对于刚开始使用 的人,可能会碰到一些问题,因... 阅读全文

css3 transform属性多值的顺序问题

2015-11-15 18:16 by 那时候的我, 26302 阅读, 4 推荐, 收藏, 编辑
摘要:对于 属性的多值的顺序问题,我自己就被困扰过。后来知道了跟顺序有关,但是不知道为什么。我想应该很多人跟我以前一样,知其然不知其所以然。如果不知道的,也许这篇文章会对大家有所帮助。先来看一个例子。 代码: <div id="red1" </div <div id="red2" </div 代码... 阅读全文

元素transform: rotate()之后,元素宽高该怎么计算?

2015-11-13 23:16 by 那时候的我, 9970 阅读, 2 推荐, 收藏, 编辑
摘要:通常,利用 元素之后,我们并不会去在意元素大小的变化,因为看上去并没有什么变化。虽然看上去没有变化,其实是有变化的。下面用一个例子来说明一下。 : <div id="rect" </div : div { width:100px; height:100px; margin: ... 阅读全文

使用sass与compass合并雪碧图(二)

2015-08-30 16:30 by 那时候的我, 1618 阅读, 1 推荐, 收藏, 编辑
摘要:上一篇文章介绍了怎样使用`compass`合并雪碧图,生成的`icons.css`文件中单位是`px`,PC端可以直接在html文件中使用,但在移动端,我们需要根据不同分辨率的屏幕,来缩放图片大小,显然使用`px`单位肯定是不行的。所以需要做一下单位转换的工作。移动端使用`rem`作为单位是最合适不... 阅读全文

使用sass与compass合并雪碧图(一)

2015-08-29 21:55 by 那时候的我, 2629 阅读, 0 推荐, 收藏, 编辑
摘要:雪碧图就是很多张小图片合并成一张大图片,以减少HTTP请求,从而提升加载速度。有很多软件可以合并雪碧图,但通常不太容易维护,使用compass生成雪碧图应该算是非常方便的方法了,可以轻松的生成雪碧图,而且易维护。## 安装sass与compass ##安装sass可以参考[这里](http://ww... 阅读全文

Flexbox + js实现滑动拼图游戏

2015-08-23 20:10 by 那时候的我, 2000 阅读, 0 推荐, 收藏, 编辑
摘要:滑动拼图就是把一张图片分成几等份,打乱顺序(下图),然后通过滑动拼凑成一张完整的图片。 要实现一个拼图游戏,需要考虑怎样随机的打乱顺序,怎样交换两张图片的位置,等等。但是,使用了Flexbox布局以后,这都不需要你去考虑,浏览器会帮你做,Flexbox就是这么的强大。关于Flexbox的介绍可以点击... 阅读全文