2015年10月 归档

结合HTML5、CSS3、JS模拟微信摇一摇开发小记

分类：编程代码 | 2015-10-31 04:10:23 | 浏览(8,473)

4条评论

客户想要通过网页实现一个类似微信摇一摇的小游戏，周末在家没事，就做了下，摇一摇之前有做，但是效果不是类似微信那样的，所以照搬旧实现方案，采用github上人气略高的一个Device Accelerometer封装函数，这样就不用自己去爬各种坑了。

摇动事件是解决了，但想模拟声音、震动之类的，还得找一下新的api，因为之前没用过，所以大概收集了下资料，下面简单记录一下。

摇动就不再赘述了，简单几步，可以参考这里https://github.com/alexgibson/shake.js
查看更多...

纯CSS实现Footer固定底部，超过一屏自动撑开

分类：设计园地 | 2015-10-22 11:10:04 | 浏览(28,045)

9条评论

日常开发中经常遇到网页内容过少时底部版权区域上浮，网页是经典的Header、Content、Footer三部分组成的情况下，之前要么采用js修改Footer的position，高度低于一屏时采用fixed，超出改用static，但是这样会出现抖动，也试过初始化时设置Content的min-height，但终归是使用了js，不太完美，CSS的也试过使用margin-bottom:-10000px;padding-bottom:10000px的方法填充底部颜色，但效果不见得有多好看。

最近又遇到此类问题，尝试采用之前提到过的CSS水平垂直居中方法来解决，最终找到比较靠谱的方法，就此总结一下，以备后用。

废话不说，直接上代码，以下为CSS，采用border-box，所以IE7下面无效，由于工作原因，只测试到IE8，没考虑低版本浏览器。 查看更多...