18
Feb
February 18, 2013 分类: DHTML     作者: hoverlees     留言: 2

记得以前玩红白机时代最喜欢的一款游戏,可以存盘,通过攻占城池的方式占领整个大陆,简单又好玩的游戏。一直都想自己也做一个。所以就基于HTML5做了一个这样的游戏。找了很多的素材可惜还是不大好看。不过玩起来确实还是很有意思的。

这是年前比较闲的时候做的,过完年后回来完善了,添加到了游戏的列表页中去了,有兴趣的朋友可以玩来试试。

游戏对战时具有魔法系统,可以使用五种魔法,魔法通过购买魔法符使用的。电脑做得有点强,困难游戏比较难打,我到现在基本上最多打到三个城然后就被电脑占领到两个城。游戏中的人物除了国王是按照用户的登录名设置的之外,其它将军名字都是用程序组成的,所以有时候会看到比较搞笑的名字。不过这种概率也不高。每个城隐藏有50个隐藏将军,够的请。另外,游戏需要通过右下角的菜单展开后手动保存,下次进入才能载入进度。

游戏还是按iphone4s的全屏设计,如果用电脑玩只会显示比较小一块区域。

   


查看详细内容 »

20
Jan
January 20, 2013 分类: DHTML     作者: hoverlees     留言: 4

在以前实现的websocket服务器基础之上又加了一个五子棋对战游戏.现在服务器已经支持火拼俄罗斯方块和五子棋两个网络对玩的游戏了.

这个游戏同样支持电脑和手机的HTML5浏览器,由于这一次的游戏界面是自伸缩,所以对不同浏览器的效果都还不错.

由于手机屏幕比较小和手指难准确定位的因素,所以特地给触屏事件添加了放大处理,当第一次点击棋盘时,放大棋盘,第二次点击要放置的位置时才放置棋子.放大模式下,两个手指点击棋盘时缩小到全盘大小. 电脑上则不进行这样的逻辑处理,直接点击棋子放置区域放置棋子.


查看详细内容 »

标签:
18
Jan
January 18, 2013 分类: DHTML     作者: hoverlees     留言: 发表

昨天演示了flash的位图处理效果,今天再演示一下HTML5的位图处理效果。HTML5是靠使用ImageData对象来处理相素数据的,只要能拿到相素数据,那给相片添加滤镜效果也是很容易的事。

下面的内容HTML5浏览器可以观看:

您的浏览器不支持CANVAS

09
Dec
December 9, 2012 分类: ASM/C/C++, DHTML     作者: hoverlees     留言: 2

有vps就是好! 抽了几个周末的空闲时间完成了火拼俄罗斯的websocket服务器及客户程序,现在已经支持新版的websocket协议和苹果设备支持的websocket协议. 做这个的初衷是为了几个人在一起无聊的时候可以用手机连机玩些小游戏打发无聊时光.本人已经测试即使走最慢的移动的Edge网络,也不影响相互连机.

火拼俄罗期电脑的玩法跟QQ游戏的一样,上下左右方向键控制移动和旋转,空格直接下落,数字1,2,3,4使用道具给指定号码的玩家.

手机是通过在屏幕任意位置滑动时左右移动,点击自己游戏区域的上部变形,点击自己游戏区域的下部分下落,点击玩家编号向指定玩家使用道具.

游戏大厅地址: http://www.hoverlees.com/game

这个是直接登录链接: 点击这里直接登录


查看详细内容 »

标签:
23
Nov
November 23, 2012 分类: DHTML     作者: hoverlees     留言: 发表

json本来就是使用javascript语法,所以javascrpit自己就可以解析json.大胆猜测我这个函数在IE6浏览器上也没有问题,比JSON类兼容性还好.

写个示例给大家:

function jsonParse(json){
    json="a="+json;
    return eval(json);
}
//解析json串 {"a":"\u4e2d\u6587","b":"xixi","d":{"a":1},"f":[1,2,3,4,5,6]}
var json='{"a":"\\u4e2d\\u6587","b":"xixi","d":{"a":1},"f":[1,2,3,4,5,6]}'; //注意这个多个斜杠只是转义
var obj=jsonParse(json);
alert(obj.a);

运行结果,输出”中文”二字.

如果要让老版浏览器兼容JSON类,可以像下面这样实现:

if(typeof(JSON)=='undefined'){
     window.JSON={
     	parse:function(json){
     		return eval("a="+json);     	
     	}     
     };
}
05
Sep
September 5, 2012 分类: DHTML, Interesting     作者: hoverlees     留言: 4

最近想着给博客稍微装修一下,想到了把这个小兔子拿来做博客背景,放了两天,又觉得让它动起来是不是更有意思,动起来后又想来得什么小的交互了。。。

为了让小兔子动起来能尽量支持所有的浏览器,我使用了切换背景的方式,两眼放光就是使用的HTML5的Canvas绘制实现了,所以普通的浏览器应该能看到小兔子跟着鼠标动动,要两眼放光嘛,得用支持HTML5的浏览器才行,如IE9,较新的Firefox,Chrome,Opera,Safri等。

通过点击网页任意区域实现两眼放光效果。


查看详细内容 »

21
Jun
June 21, 2012 分类: DHTML     作者: hoverlees     留言: 发表

javascript的prototype在新对象创建时会复制这个类的prototype到新的实例,但要注意,它不会完全复制值是对象的属性,而是复制对象的指针。另一方面,这样可以达到面象对象中的静态变量效果。

如下面的示例代码所示:

function A(num){
    this.num=num;
    this.inner.instanceNum++;
}
A.prototype={
    num:0,
    inner:{
        instanceNum:0,
        invokeNum:0
    },
    setNum:function(num){
        this.num=num;
        this.inner.invokeNum++;
    },
    toString:function(){
        return "Num:"+this.num+" instanceNum:"+this.inner.instanceNum+" setNum:"+this.inner.invokeNum;
    }
};
var a=new A(10);
var b=new A(20);
var c=new A(30);
a.setNum(100);
b.setNum(200);
b.setNum(200);
c.setNum(300);
c.setNum(300);
c.setNum(300);
alert(a);
alert(b);
alert(c);

这段代码咋一看,执行完成后所有对象inner.instanceNum都应该等于1,a的inner.invokeNum=1,b的是2,c的是3
而程序的真正输出是
Num:100 instanceNum:3 setNum:6
Num:200 instanceNum:3 setNum:6
Num:300 instanceNum:3 setNum:6

所以如果使用prototype方式的面向对象编程,在原型的定义里,属性的值不能是对象,否则它相当于标准面象对象里的静态变量了(但这正好是js的静态变量定义方式呢)
正确的方式应该是在构造函数里声明对象,如下

function A(num){
    this.num=num;
    this.inner={
        instanceNum:0,
        invokeNum:0
    };
    this.inner.instanceNum++;
}
A.prototype={
    num:0,
    inner:null,
    setNum:function(num){
        this.num=num;
        this.inner.invokeNum++;
    },
    toString:function(){
        return "Num:"+this.num+" instanceNum:"+this.inner.instanceNum+" setNum:"+this.inner.invokeNum;
    }
};
var a=new A(10);
var b=new A(20);
var c=new A(30);
a.setNum(100);
b.setNum(200);
b.setNum(200);
c.setNum(300);
c.setNum(300);
c.setNum(300);
alert(a);
alert(b);
alert(c);
21
Jun
June 21, 2012 分类: DHTML     作者: hoverlees     留言: 发表

这是本人比较习惯的javascript面象对象写法,里面有一些关于包、类、抽象函数、继承、重载的一些写法,供有兴趣的朋友参考,也期待宝贵的建议。

代码中实现的是一个“车辆”类,并用Car和Tank继承,其中Tank具有攻击性。最后以console的方式表现了三个对象之间的攻击效果。


查看详细内容 »

07
Jan
January 7, 2011 分类: DHTML     作者: hoverlees     留言: 发表

最近在做一个PHP的MVC,需要用一个横向tab效果,然后就写了个,希望有人用得着…
Tab效果实现的方法很多,每个人都可能会有自己的实现方式,既然是万国牌,再写写我的方法也无妨,相信这种做法的人也会很多。

这种tab分为左右两块,左边是tab,右边是内容,由于选中的tab把右边框架的边框盖住了,所以会给人一种整体的效果。
已测试浏览器:IE6,IE8,ff,chrome,opera.


查看详细内容 »

标签: ,
20
Nov
November 20, 2010 分类: DHTML, PHP/MySQL     作者: hoverlees     留言: 3

现在看来内容也差不多了,准备把博客脱离我的cent os,发布到互联网上去了。这个主题还是感觉不是很满意,自己已经尽力了,虽然看起来还是不大搭配。目前测试的浏览器有IE6,IE8,Opera,Firefox,效果都达到预期。下周到公司去看看其它的浏览器效果。在我的印象中,我的css写法好像不大适应google流览器。

网页做成wordpress主题倒还很简单,wordpress的框架还是挺不错的。个人觉得模板这儿没自己写的PHP框架好,至少我写的MVC框架,标签是订制的,而不是让美工去嵌入PHP代码,呵呵,自恋一下,其实这个是习惯问题而已。

标签:
快速链接
推荐标签
最新图片
较新文章
随机推荐
友情链接