关于作者

JavaScript游戏开发之碰撞事件

上一篇 / 下一篇  2008-09-24 08:18:26 / 个人分类：JavaScript

查看( 11 ) / 评论( 28 )

CODE:

                        <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<!-- saved from url=(0047)[url]http://www.dhteumeuleu.com/dhtml/Falling-X.html[/url] -->
<HTML><HEAD><TITLE>once upon a time - Interactive DHTML art-demos</TITLE>
<FCK:META. http-equiv=Content-Type content="text/html; charset=gb2312" />
<FCK:META. content="Gerard Ferrandez at [url]http://www.dhteumeuleu.com[/url]" name=author />
<FCK:META. http-equiv=imagetoolbar content=no />
<STYLE. type=text/css>BODY {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BACKGROUND: #000000; LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; OVERFLOW: hidden; WIDTH: 100%; CURSOR: url('http://www.dhteumeuleu.com/no.cur'); PADDING-TOP: 0px; POSITION: absolute; TOP: 0px; HEIGHT: 100%
}
SPAN {
POSITION: absolute
}
</STYLE>
<SCRIPT. type=text/javascript><!--
// ====================================================
// script. Gerard Ferrandez - Ge-1-doot - DECEMBER 2K4
// [url]http://www.dhteumeuleu.com/[/url]
// crossbrowser: IE6 - Firefox - Opera - NS7
// ====================================================

window.onerror = new Function("return true")
var O   = new Array()
var SH  = SW = SPA = SO = xm = ym = XQ = YQ = YB = XB = 0
var pS  = 25
var pQ  = 100
var pQ2 = pQ / 2
var pS2 = pS / 2

function CObj(N){
        this.N = N
        o = document.createElement("span")
        SPA.appendChild(o)
        with(o.style){
                top = -pS
                width = pS
                height = pS
                fontSize = "1px"
                background = "#000000"
                border = "gray solid 1px"
        }
        this.pO = o.style
        this.pX = 0
        this.pY = 1000
        this.zX = 0
        this.zY = 1
        this.Li = false
       
        this.run = function () {
                with (this) {
                        zX *= .95
                        pY += zY
                        pX += zX
                        zY += .1 + N * .001
                        if(pY>SH){
                                pY = -pS
                                pX = Math.round(Math.random() * SW)
                                zY = 0
                                zX = 0
                                pO.background = "#000000"
                        }
                        if(pX >= XQ - pS2 && pX <= XQ + pQ + pS2 && pY >= YQ - pS && pY <= YQ + pQ){
                                pY -= zY
                                zX += ((pX >= XQ + pQ2)?1:-1) * (.5 * zY + Math.abs(YQ - YB) * .2)
                                if(pY < YQ - (YQ - YB)) pY = YQ - pS, zY = 0; else pX += XQ - XB;
                                if(!Li){
                                        Li = true
                                        pO.background = "#FFFFFF"
                                        setTimeout("O["+N+"].Li=false;O["+N+"].pO.background='#000000'", 1200)
                                }
                        }
                        pO.left = pX - pS2
                        pO.top  = pY
                        setTimeout("O["+N+"].run()", 16)
                }
        }
}
function pQM(){
        YB = YQ
        XB = XQ
        XQ = SO.left = xm - pQ2
        YQ = SO.top  = ym - pQ2
        setTimeout(pQM, 16)
}

function resize() {
        with(SPA.style){
                L = left = Math.round(-1+(document.body.offsetWidth - SW) / 2)
                H = top  = Math.round(-1+(document.body.offsetHeight - SH) / 2)
                width    = SW
                height   = SH
        }
}
onresize = resize

onload = function (){
        document.onmousemove = function(e){
                if (window.event) e = window.event
                xm = (e.x || e.clientX) - L
                ym = (e.y || e.clientY) - H
        }
        SPA = document.getElementById("SPAN")
        SO  = document.getElementById("SPLASH").style
        SO.width  = pQ
        SO.height = pQ
        SH  = document.body.offsetHeight
        SW  = pQ - pS2
        SX  = Math.round(SW / pS) - 1
        xm  = SW / 2
        ym  = SH / 2
        resize()
        pQM()
        for(j=0;j<60;j++){
                O[j] = new CObj(j)
                setTimeout("O["+j+"].run()",j * 123)
        }
}
//-->
</SCRIPT>
<FCK:META. content="MSHTML 6.00.3790.4210" name=GENERATOR /></HEAD>
<BODY>
<DIV id=SPAN style="BACKGROUND: #222222; POSITION: absolute">
<DIV id=SPLASH
style="BORDER-RIGHT: gray 1px solid; BORDER-TOP: gray 1px solid; FONT-SIZE: 1px; BACKGROUND: #000000; BORDER-LEFT: gray 1px solid; BORDER-BOTTOM: gray 1px solid; POSITION: absolute; TOP: -1000px"></DIV></DIV><div style="font-size:16px;"> div></body></HTML>

论坛模式 推荐 收藏 分享给好友 推荐到圈子 管理

TAG:

campaign发布于2008-09-12 09:58:11
太强了
和有意思
xjfseasky发布于2008-09-12 11:55:24
一片黑色。。。迷茫中
cloudgamer的个人空间 cloudgamer 发布于2008-09-12 13:58:18
看过
很厉害
风云舞的个人空间 风云舞 发布于2008-09-12 15:09:47
粉牛,改成VML就更好了
wangjianbo发布于2008-09-12 15:26:45
厉害，收藏
softfire发布于2008-09-12 15:42:08
太强了！！！！！

收藏







-----------------------------------------------------
http://www.17ext.com   Ext中文社区
kstg750718发布于2008-09-12 15:42:15
以前好像在哪里看过.很厉害
qgy18发布于2008-09-13 01:50:01
哈哈，太好玩了
lgjion发布于2008-09-15 17:11:09
牛一个
rayking发布于2008-09-15 22:17:07
很黑很暴力
bym2000发布于2008-09-16 10:40:49
很牛的效果~！
fly8的个人空间 fly8 发布于2008-09-16 11:00:39

aasvvv发布于2008-09-16 15:02:17
碰撞的感觉有点不太对，我把数量改小了，大家试试

CODE:

                        <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<!-- saved from url=(0047)[url]http://www.dhteumeuleu.com/dhtml/Falling-X.html[/url] -->
<HTML><HEAD><TITLE>once upon a time - Interactive DHTML art-demos</TITLE>
<FCK:META http-equiv=Content-Type content="text/html; charset=gb2312" />
<FCK:META content="Gerard Ferrandez at [url]http://www.dhteumeuleu.com[/url]" name=author />
<FCK:META http-equiv=imagetoolbar content=no />
<STYLE type=text/css>BODY {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BACKGROUND: #000000; LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; OVERFLOW: hidden; WIDTH: 100%; CURSOR: url('http://www.dhteumeuleu.com/no.cur'); PADDING-TOP: 0px; POSITION: absolute; TOP: 0px; HEIGHT: 100%
}
SPAN {
POSITION: absolute
}
</STYLE>
<SCRIPT type=text/javascript><!--
// ====================================================
// script: Gerard Ferrandez - Ge-1-doot - DECEMBER 2K4
// [url]http://www.dhteumeuleu.com/[/url]
// crossbrowser: IE6 - Firefox - Opera - NS7
// ====================================================

window.onerror = new Function("return true")
var O   = new Array()
var SH  = SW = SPA = SO = xm = ym = XQ = YQ = YB = XB = 0
var pS  = 25
var pQ  = 100
var pQ2 = pQ / 2
var pS2 = pS / 2

function CObj(N){
        this.N = N
        o = document.createElement("span")
        SPA.appendChild(o)
        with(o.style){
                top = -pS
                width = pS
                height = pS
                fontSize = "1px"
                background = "#000000"
                border = "gray solid 1px"
        }
        this.pO = o.style
        this.pX = 0
        this.pY = 1000
        this.zX = 0
        this.zY = 1
        this.Li = false
       
        this.run = function () {
                with (this) {
                        zX *= .95
                        pY += zY
                        pX += zX
                        zY += .1 + N * .001
                        if(pY>SH){
                                pY = -pS
                                pX = Math.round(Math.random() * SW)
                                zY = 0
                                zX = 0
                                pO.background = "#000000"
                        }
                        if(pX >= XQ - pS2 && pX <= XQ + pQ + pS2 && pY >= YQ - pS && pY <= YQ + pQ){
                                pY -= zY
                                zX += ((pX >= XQ + pQ2)?1:-1) * (.5 * zY + Math.abs(YQ - YB) * .2)
                                if(pY < YQ - (YQ - YB)) pY = YQ - pS, zY = 0; else pX += XQ - XB;
                                if(!Li){
                                        Li = true
                                        pO.background = "#FFFFFF"
                                        setTimeout("O["+N+"].Li=false;O["+N+"].pO.background='#000000'", 1200)
                                }
                        }
                        pO.left = pX - pS2
                        pO.top  = pY
                        setTimeout("O["+N+"].run()", 16)
                }
        }
}
function pQM(){
        YB = YQ
        XB = XQ
        XQ = SO.left = xm - pQ2
        YQ = SO.top  = ym - pQ2
        setTimeout(pQM, 16)
}

function resize() {
        with(SPA.style){
                L = left = Math.round(-1+(document.body.offsetWidth - SW) / 2)
                H = top  = Math.round(-1+(document.body.offsetHeight - SH) / 2)
                width    = SW
                height   = SH
        }
}
onresize = resize

onload = function (){
        document.onmousemove = function(e){
                if (window.event) e = window.event
                xm = (e.x || e.clientX) - L
                ym = (e.y || e.clientY) - H
        }
        SPA = document.getElementById("SPAN")
        SO  = document.getElementById("SPLASH").style
        SO.width  = pQ
        SO.height = pQ
        SH  = document.body.offsetHeight
        SW  = pQ - pS2
        SX  = Math.round(SW / pS) - 1
        xm  = SW / 2
        ym  = SH / 2
        resize()
        pQM()
        for(j=0;j<2;j++){
                O[j] = new CObj(j)
                setTimeout("O["+j+"].run()",j * 123)
        }
}
//-->
</SCRIPT>
<FCK:META content="MSHTML 6.00.3790.4210" name=GENERATOR /></HEAD>
<BODY>
<DIV id=SPAN style="BACKGROUND: #222222; POSITION: absolute">
<DIV id=SPLASH
style="BORDER-RIGHT: gray 1px solid; BORDER-TOP: gray 1px solid; FONT-SIZE: 1px; BACKGROUND: #000000; BORDER-LEFT: gray 1px solid; BORDER-BOTTOM: gray 1px solid; POSITION: absolute; TOP: -1000px"></DIV></DIV><div style="font-size:16px;"> div></body></HTML>
lushan发布于2008-09-16 17:15:31
牛，实在是牛！
sigmazel发布于2008-09-16 17:43:36
真他妈的牛.
freewind22发布于2008-09-17 16:20:44
学习..
零夜发布于2008-09-18 22:33:39
挺牛的。非常不错！
mingxiaodong的个人空间 mingxiaodong 发布于2008-09-19 08:35:21
学习中
yijianfengyu发布于2008-09-19 09:49:36
看不懂，哪个是发生碰撞的事件？哪段代码控制碰的时候事件发生的是哪个 啊？哪段代码？



明白了，计算距离的！如果距离为0，就发生碰撞，就重新设定位置！

[[I] 本帖最后由 yijianfengyu 于 2008-9-19 10:01 编辑 [/I]]
muxrwc发布于2008-09-19 11:07:02
看起来好帅啊。。。
不过碰的貌似不太和谐。。。
物理不懂的飘过。。。
我来说两句

(可选)