emu in blogjava
  BlogJava :: 首页 :: 新随笔 :: 联系 :: 聚合  :: 管理 ::
  171 随笔 :: 103 文章 :: 1052 评论 :: 2 Trackbacks
仿写了一个游戏
Letters 是个很有意思的联机小游戏，其实非常简单，就是大家可以抢字母来拼自己喜欢的单词，每天上去都会看到一群类此不疲的玩家。

一时心血来潮仿写了一个单机版的：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> 字母漂移 </TITLE>
<META NAME="Author" CONTENT="emu">
<META NAME="Keywords" CONTENT="game">
<SCRIPT LANGUAGE="JavaScript" defer>
<!--
var isIE=!!document.all;
function checkMouseMove(event){
    if (window.activeElement){
        var elm = window.activeElement;
                elm.style.left = event.clientX-elm.innerX;
        elm.style.top = event.clientY-elm.innerY;
    }
}
function releaseMouse(event){
    if (window.activeElement){
        activeElement.newX = event.clientX-activeElement.innerX;
        activeElement.newY = event.clientY-activeElement.innerY;
        window.activeElement = null;
    }
}
function drag(event){
    if (event.button>1) return;
    var elm = isIE?event.srcElement:event.target;
    window.activeElement = elm;
    elm.oldX = elm.offsetLeft;
    elm.oldY = elm.offsetTop;
    elm.innerX = event.clientX - elm.oldX;
    elm.innerY = event.clientY - elm.oldY;
}

function slideTo(id,x,y){
    var d=5    
    var e = document.getElementById(id);
    var l = e.style.left?parseInt(e.style.left):0;
    var t = e.style.top?parseInt(e.style.top):0;
    if(Math.abs(l-x)<=d && Math.abs(t-y)<=d) return;
    if(l!=x) e.style.left=l+(l<x?d:-d)
    if(t!=y) e.style.top=t+(t<y?d:-d)
    if(e.timer) clearTimeout(e.timer)
    e.timer=setTimeout("slideTo("+id+","+x+","+y+")",3)
}
setInterval("slide()",300);
function slide(){
    slideTo(Math.floor(Math.random()*26),Math.floor(Math.random()*670+15),Math.floor(Math.random()*470+15))
}
//-->
</SCRIPT>
</HEAD>
<style>b{position:absolute;cursor:pointer;font-size:20}</style>
<BODY onmousemove="checkMouseMove(event)" onmouseup="releaseMouse(event)" oncontextmenu="return false" onselect="return false" ondblclick="return false">
<div style="background-color:yellow;width:700;height:500;overflow:hidden">
<SCRIPT>
var n=104;
for(var i=0;i<n;i++)
    document.write('<b onmousedown="drag(event)" id="'+i+'" style="left:'+Math.floor(Math.random()*670+15)+';top:'+Math.floor(Math.random()*470+15)+';color:#'+(Math.floor(Math.random()*(1<<24))|(1<<23)).toString(16)
    +'" onbeforselect="return false">'+String.fromCharCode(i%26+65)+'</b>');
</SCRIPT>
</div>
</BODY>
</HTML>


看起来也似模似样了呵呵。至少比Letters 单机版要有可玩性，更不要说体积只有它的几十分只一了。

直接拷贝下来保存为html文件，或者点击这里下载。在IE6和Firefox1.5下面同过。

运行效果如下：
posted on 2006-01-18 00:30 emu 阅读(2508) 评论(6)  编辑  收藏

评论

# re: 仿写了一个游戏 2006-01-18 08:49 Robin's Java World
玩了一下，发现用JS写的跟FLASH做的还是有一定的差别，一是效果没有那么好，二是在拖动字母的时候会出现选中很多字母的问题。  回复  更多评论
  

# re: 仿写了一个游戏 2006-01-18 09:18 豹豹
选中很多字母,可以屏蔽 onselectstart 事件来解决  回复  更多评论
  

# re: 仿写了一个游戏 2006-01-18 09:24 emu
MFF屏蔽不了。
其实按照原游戏的效果，这些字母都应该是gif图片做的，本来就不存在选中问题。
不过写程序纯粹为了好玩，没花那么多时间来做这些细节，只是随便放些字母上去。  回复  更多评论
  

# re: 仿写了一个游戏 2006-01-18 09:31 emu
直接拷贝代码下来不能运行，是因为这一行：
<style>b{position:absolute;cursor:hand;font-size:20}</style>
从上面拷贝下来的时候居然变成：
<style>b{}{position:absolute;cursor:hand;font-size:20}</style>
这是代码展示器的一个bug了，自己改回来就好了。
  回复  更多评论
  

# re: 仿写了一个游戏 2006-05-17 00:22 梦游客
好样的, 小子, 我关注你哈  回复  更多评论
  

# re: 仿写了一个游戏 2008-09-02 12:32 Relucent
很有意思  回复  更多评论
  


只有注册用户登录后才能发表评论。
网站导航: