2048

[ 前端攻城 ] 2014年3月27日

先是有一款让人欲罢不能的flappy bird,最近又出了一个简单也让人上瘾的游戏2048,它基于游戏1024,和Threes游戏规则差不多。2048风靡之后,很多人对其进行了修改,制作了朝代版口袋妖怪版等等,其实还有很多,网上一搜是一大片。

在查看2048源码时,有这么一段代码:

  (function() {
  var lastTime = 0;
  var vendors = ['webkit', 'moz'];
  for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {
    window.requestAnimationFrame = window[vendors[x]+'RequestAnimationFrame'];
    window.cancelAnimationFrame =
    window[vendors[x]+'CancelAnimationFrame'] || window[vendors[x]+'CancelRequestAnimationFrame'];
  }

  if (!window.requestAnimationFrame) {
    window.requestAnimationFrame = function(callback, element) {
      var currTime = new Date().getTime();
      var timeToCall = Math.max(0, 16 - (currTime - lastTime));
      var id = window.setTimeout(function() { callback(currTime + timeToCall); },
      timeToCall);
      lastTime = currTime + timeToCall;
      return id;
    };
  }

  if (!window.cancelAnimationFrame) {
    window.cancelAnimationFrame = function(id) {
      clearTimeout(id);
    };
  }
}());

代码里面用到 requestAnimationFrame,它是浏览器提供的统一帧管理、提供监听帧的API,为了解决复杂和流畅性要求高的动画形式。这是传统setInterval函数实现的动画无法达到的。

使用了requestAnimationFrame之后,自己的动画绘制就跟着浏览器的绘制间隔走,不会存在过度绘制的问题,动画不掉帧。

浏览器兼容性:

requestAnimationFrame

总的来兼容不是很好,安卓设备根本不支持。就需要一个兼容方法了,当然就是上面贴出的代码,连IE6都支持哦。

来个效果,点下面的按钮,会滚上去然后滚下来。

调用方法:

window.requestAnimationFrame(function () {
  //动画
});

使用MyDate97控件制作节假日管理的前端

[ 前端攻城 ] 2014年3月26日

在设计一些管理系统的时候,需要考虑工作日的管理,这样就一般要列出所有日历,然后设定工作日了。感觉自己实现的话比较难,不太敢动手。在百度上找到一篇文章,上面介绍了使用MyDate97控件来实现的方法。

  • 1.日历的每个月份是一个iframe,由MyDate97决定的,有能力的可以自己修改。
  • 2.因为是iframe组成,所以在初始化页面的时候,要延迟,再跨域操作。
  • 3.作者很早(2009年)发布的了,所以可能对一些浏览器不支持,自己调整啦。

 

内容转自MyDate97日历控件 和 Jquery 做成的 工作日维护

上面有提供的代码,另外我也打包了一个demo版本,就在下面↓。

http://pan.baidu.com/s/1cTbGU

让Nginx支持中文URL和中文目录

[ 前端攻城 ] 2014年3月6日

1.确定系统是不是uft8编码

env|grep LANG
LANG=en_US.UTF-8

2.Nginx配置文件设置默认编码为uft-8

server
{
    listen 80;
    server_name idayer.com ;
    index index.html index.htm index.php;
    root /usr/local/nginx/html/;
    charset utf-8;
}

3.用工具上传的时候,注意默认编码也是为uft-8

4.处理已经上传的中文名文件

在其目录中执行:

for f in `ls *.html` ; do mv $f `ls $f¦iconv -f GBK -t UTF-8`; done

注意:上面代码执行过的文件,如果被代码再次处理,会导致文件无法在winscp里面删除。

为iPhone4开启相机的实时滤镜-iOS7

[ iOS ] 2014年2月28日

iPhone4在现在算是古老的设备了,即将失去苹果的支持。iOS7中iPhone4的相机没有了实时过滤功能(Live Filter),当然了还有其他方面的特性也会取消了,着实让人感觉苹果不厚道。好在这些功能不是在固件里面被阉割,可以另外开启。

使用Theos开发一个锁屏Tweak

[ iOS ] 2014年2月16日

iOSOpenDev是一款简化越狱开发的工具,它包含了开发中用的到一切,并且是使用Xcode开发,自动创建deb文件。不过不少开源的Cydia插件都是直接使用theos开发,所以最近主要学习了关于theos的使用,介绍如何制作一个锁屏插件。

iOSOpenDev越狱开发环境安装

[ iOS ] 2014年2月1日

近日心血来潮,想好好研究下ios越狱开发,所以简单分享下越狱开发环境的安装。首先,你要有一台Mac,安装好Xcode和Command Line Tools

ios-cydia-tool

1.安装MacPorts

MacPorts,是一款软件包管理系统,用来简化Mac OS和Darwin操作系统上软件的安装.MacPorts就像apt-get一样,可以快速安装一些开源软件.

光纤猫zxhn f420破解

[ 生活随笔 ] 2014年1月25日

电信的光纤猫安装的时候一般不会告诉你超级密码,所以宽带账号和密码也无从得知了。不过这可难不倒网上的牛人们,各种方法是层出不穷。

本文破解的是中兴ZXHN F420的光猫。时间为2014年1月24号。

硬件版本号 v3.0
软件版本号 V3.30.10P6T2S