JS版连连看

最新推荐文章于 2024-07-20 23:54:17 发布
wxg22526451
最新推荐文章于 2024-07-20 23:54:17 发布
阅读量900
点赞数
分类专栏： JavaScript 文章标签： function javascript 游戏 border xml null
JavaScript 专栏收录该内容
3 篇文章 0 订阅
订阅专栏
游戏地址： http://bolm.cn/game/llk/
 
 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>珍藏游戏 - 鬼诞连连看 - 卜咯米，Web设计驱动力！</TITLE>
<META HTTP-EQUIV="imagetoolbar" CONTENT="no">
<SCRIPT LANGUAGE="JavaScript">
<!--
    var $kyodai = {mapX:19, mapY:11, mapLength:14}
    // 一个点(x,y)向4面延伸直到遇到障碍或出界 (画十字)
    $kyodai.cross = function(x, y)
    {
        for (var xx1=x-1; x1>-1; x1--)
            if ($kyodai.block[x1+ "," +y]) break
        for (var xx2=x+1; x2<$kyodai.mapX; x2++)
            if ($kyodai.block[x2+ "," +y]) break
        for (var yy1=y-1; y1>-1; y1--)
            if ($kyodai.block[x+ "," +y1]) break
        for (var yy2=y+1; y2<$kyodai.mapY; y2++)
            if ($kyodai.block[x+ "," +y2]) break
        return {x1:x1, x2:x2, y1:y1, y2:y2}
    }
    // x 方向2点间是否连通
    $kyodai.passx = function(x1,x2,y)
    {
        if (x1 < x2)
        {
            while (++x1 < x2)
                if ($kyodai.block[x1+ "," +y]) return false
        }
        else
        {
            while (++x2 < x1)
                if ($kyodai.block[x2+ "," +y]) return false
        }
        return true
    }
    // y 方向
    $kyodai.passy = function(y1,y2,x)
    {
        if (y1 < y2)
        {
            while (++y1 < y2)
                if ($kyodai.block[x+ "," +y1]) return false
        }
        else
        {
            while (++y2 < y1)
                if ($kyodai.block[x+ "," +y2]) return false
        }
        return true
    }
    // x 方向2点间画一条线 (连通情况下)
    $kyodai.linex = function(x1, x2, y)
    {
        var path = []
        if (x1 < x2)
        {
            while (x1++ < x2)
            path.push('<img src="images/linex.gif" style="position:absolute;left:'+(x1*31-16)+'px;top:'+y*35+'px">')
        }
        else
        {
            while (x2++ < x1)
            path.push('<img src="images/linex.gif" style="position:absolute;left:'+(x2*31-16)+'px;top:'+y*35+'px">')
        }
        return path
    }
    // y 方向
    $kyodai.liney = function(y1, y2, x)
    {
        var path = []
        if (y1 < y2)
        {
            while (y1++ < y2)
            path.push('<img src="images/liney.gif" style="position:absolute;left:'+x*31+'px;top:'+(y1*35-18)+'px">')
        }
        else
        {
            while (y2++ < y1)
            path.push('<img src="images/liney.gif" style="position:absolute;left:'+x*31+'px;top:'+(y2*35-18)+'px">')
        }
        return path
    }
    // 寻找2点间的连线
    $kyodai.find = function(sx,sy,ex,ey)
    {
        // 开始点画十字
        var s = $kyodai.cross(sx, sy)
        // 如果开始点十字穿过结束点
        if (sy==ey && s.x1<ex && ex<s.x2) return $kyodai.linex(sx, ex, sy)
        if (sx==ex && s.y1<ey && ey<s.y2) return $kyodai.liney(sy, ey, sx)
        // 结束点画十字
        var e = $kyodai.cross(ex, ey)
        // 开始点与结束点十字重叠部分
        var x1 = s.x1 < e.x1 ? e.x1 : s.x1
        var x2 = s.x2 > e.x2 ? e.x2 : s.x2
        var y1 = s.y1 < e.y1 ? e.y1 : s.y1
        var y2 = s.y2 > e.y2 ? e.y2 : s.y2
        // 如果结束点十字穿过开始点十字
        if (x1<sx && sx<x2 && y1<ey && ey<y2)
            return $kyodai.liney(sy, ey, sx).concat($kyodai.linex(sx, ex, ey))
        if (x1<ex && ex<x2 && y1<sy && sy<y2)
            return $kyodai.liney(sy, ey, ex).concat($kyodai.linex(sx, ex, sy))
        // 两点之内 x 方向十字重叠部分 y 方向是否能连通
        if (sx < ex)
        {
            var x3 = sx
            var x4 = ex
            var s1 = sy
            var e1 = ey
        }
        else
        {
            var x3 = ex
            var x4 = sx
            var s1 = ey
            var e1 = sy
        }
        for (var x=x3+1; x<x4; x++)
        {
            if (x1<x && x<x2 && $kyodai.passy(s1, e1, x))
            {
                return $kyodai.liney(s1, e1, x).concat($kyodai.linex(x3, x, s1), $kyodai.linex(x, x4, e1))
            }
        }
        // y 方向
        if (sy < ey)
        {
            var y3 = sy
            var y4 = ey
            var s2 = sx
            var e2 = ex
        }
        else
        {
            var y3 = ey
            var y4 = sy
            var s2 = ex
            var e2 = sx
        }
        for (var y=y3+1; y<y4; y++)
        {
            if (y1<y && y<y2 && $kyodai.passx(s2, e2, y))
            {
                return $kyodai.linex(s2, e2, y).concat($kyodai.liney(y3, y, s2), $kyodai.liney(y, y4, e2))
            }
        }
        s1 = true
        e1 = true
        s2 = true
        e2 = true
        // 两点围成的矩形四顶点向外扩散
        while (s1 || e1 || s2 || e2)
        {
            if (s1)
            {
                if (x1 < --x3 && x3 < x2)
                {
                    if ($kyodai.passy(sy, ey, x3))
                    {
                        return $kyodai.liney(sy, ey, x3).concat($kyodai.linex(x3, sx, sy), $kyodai.linex(x3, ex, ey))
                    }
                }
                else s1 = false
            }
            if (e1)
            {
                if (x1 < ++x4 && x4 < x2)
                {
                    if ($kyodai.passy(sy, ey, x4))
                    {
                        return $kyodai.liney(sy, ey, x4).concat($kyodai.linex(x4, sx, sy), $kyodai.linex(x4, ex, ey))
                    }
                }
                else e1 = false
            }
            if (s2)
            {
                if (y1 < --y3 && y3 < y2)
                {
                    if ($kyodai.passx(sx, ex, y3))
                    {
                        return $kyodai.linex(sx, ex, y3).concat($kyodai.liney(y3, sy, sx), $kyodai.liney(y3, ey, ex))
                    }
                }
                else s2 = false
            }
            if (e2)
            {
                if (y1 < ++y4 && y4 < y2)
                {
                    if ($kyodai.passx(sx, ex, y4))
                    {
                        return $kyodai.linex(sx, ex, y4).concat($kyodai.liney(y4, sy, sx), $kyodai.liney(y4, ey, ex))
                    }
                }
                else e2 = false
            }
        }
        return false
    }
    // 读取关卡
    $kyodai.loadmap = function(xml)
    {
        $kyodai.block = {}
        $kyodai.shape = []
        var dom = new ActiveXObject("Microsoft.XMLDOM")
        dom.async = false
        // 随机地图
        dom.load(xml)
        var blocks = dom.selectSingleNode("map").text.split("/n")
        blocks.shift()
        for(var x=0; x<blocks.length; x++)
        {
            for(var y=0; y<blocks[0].length; y++)
            {
                if (blocks[x].charAt(y) == "1")
                {
                    $kyodai.shape.push({x:y, y:x})
                }
            }
        }
        // 随机填充
        var items = []
        var itemppt = $kyodai.random([1, 2, 3, 4, 5, 6, 7, 8])
        var n = 2
        var num = $kyodai.shape.length
        for (var i=0; i<5; i++)
        {
            if (items.length==8) n=1
            if (items.length==10) break
            for (var j=Math.floor(Math.random()*n)*2+2; j>0; j--)
            {
                items.push(itemppt[i])
            }
        }
        for (n=9; n<42; n++)
        {
            if (num-items.length < 3)
            {
                if (num == items.length) break
                else
                {
                    items.push(n)
                    items.push(n)
                    break
                }
            }
            items.push(n)
            items.push(n)
            items.push(n)
            items.push(n)
        }
        kyodai_remain.innerText = num
        $kyodai.remain = num
        $kyodai.setting(items)
        $kyodai.count()
    }
    // 布置图片
    $kyodai.setting = function(arr)
    {
        var itemImg = []
        $kyodai.shape = $kyodai.random($kyodai.shape)
        for (i=0; i<$kyodai.shape.length; i++)
        {
            var Img = arr[i]
            x = $kyodai.shape[i].x
            y = $kyodai.shape[i].y
            $kyodai.block[x+","+y] = Img
            if (Img)
            {
                itemImg.push('<img id=Item_'+x+'_'+y+' src="images/'+ Img + '.gif" style="z-index:'+ (100-x+y) +';position:absolute;left:'+ x*31 +'px;top:'+ y*35 +'px">')
            }
        }
        kyodai_items.innerHTML = itemImg.join("")
    }
    // 选中一个
    $kyodai.choose = function(x, y)
    {
        kyodai_cuechoose.innerText = ''
        $kyodai.point = {x:x, y:y}
        kyodai_choose.style.pixelLeft = x * 31 + 4
        kyodai_choose.style.pixelTop = y * 35
    }
    // 取消选中
    $kyodai.cancel = function()
    {
        kyodai_cuechoose.innerText = ''
        $kyodai.point = false
        kyodai_choose.style.pixelLeft = -2000
    }
    // 点击事件
    $kyodai.click = function()
    {
        var ex = Math.floor((event.x-16) / 31)
        var ey = Math.floor((event.y-182) / 35)
        if (!$kyodai.block[ex+","+ey]) return
        $kyodai.sound(2)
        if (!$kyodai.point)
        {
            // 第一次点中
            $kyodai.choose(ex, ey)
            return
        }
        var sx = $kyodai.point.x
        var sy = $kyodai.point.y
        var s = sx+","+sy
        var e = ex+","+ey
        if (s == e)
        {
            // 点中同一个
            $kyodai.cancel()
            return
        }
        var ss = $kyodai.block[s]
        var ee = $kyodai.block[e]
        if (ss != ee)
        {
            // 不同类型
            $kyodai.choose(ex, ey)
            return
        }
        $kyodai.cancel()
        $kyodai.block[s] = 0
        $kyodai.block[e] = 0
        var line = $kyodai.find(sx, sy, ex, ey)
        if (!line)
        {
            // 不能连通
            $kyodai.block[s] = ss
            $kyodai.block[e] = ee
            return
        }
        if (ee < 4) $kyodai.add(ee)
        kyodai_lines.innerHTML = line.join("")
        $kyodai.del(sx, sy, ex, ey)
    }
    // 消除一组
    $kyodai.del = function(sx,sy,ex,ey)
    {
        $kyodai.sound(3)
        $kyodai.count()
        $kyodai.remain -= 2
        kyodai_remain.innerText = $kyodai.remain
        document.getElementById("Item_"+sx+"_"+sy).removeNode()
        document.getElementById("Item_"+ex+"_"+ey).removeNode()
        kyodai_del_1.style.pixelLeft = sx * 31 - 15
        kyodai_del_1.style.pixelTop  = sy * 35 - 15
        kyodai_del_2.style.pixelLeft = ex * 31 - 15
        kyodai_del_2.style.pixelTop  = ey * 35 - 15
        kyodai_del_1.src = "images/del.gif"
        kyodai_del_2.src = "images/del.gif"
        // 全部消除
        if (!$kyodai.remain) setTimeout("$kyodai.over('win')",600)
    }
    // 倒计时
    $kyodai.count = function()
    {
        clearInterval($kyodai.timeid)
        kyodai_count.src = "images/count1.gif"
        kyodai_count.style.pixelWidth = 330
        $kyodai.timeid = setInterval(function()
        {
            var counts = kyodai_count.style.pixelWidth
            kyodai_count.style.pixelWidth = counts-1
            switch (counts)
            {
                // 颜色棒
                case 270 : kyodai_count.src = "images/count2.gif"
                break
                case 180 : kyodai_count.src = "images/count3.gif"
                break
                case 100 : kyodai_count.src = "images/count4.gif"
                break
                case  65 : kyodai_count.src = "images/count5.gif"
                break
                case  30 : kyodai_count.src = "images/count6.gif"
            }
            if (counts < 2)
            {
                // 时间耗尽
                $kyodai.over('timeover')
            }
        }
        , 80)
    }
    // 打乱数组
    $kyodai.random = function(arr)
    {
        var rnd = []
        while (arr.length)
        {
            rndrnd=rnd.splice(0,Math.floor(Math.random()*(rnd.length+1))).concat(arr.splice(Math.floor(Math.random()*arr.length),1),rnd)
        }
        return rnd
    }
    // 添加道具
    $kyodai.add = function(id)
    {
        if ($kyodai.pptnum[id])
        {
            document.getElementById("kyodai_ppt_"+id+"_num").src = "images/ppt_num_"+ ++$kyodai.pptnum[id] +".gif"
        }
        else
        {
            $kyodai.pptnum[id] = 1
            kyodai_ppt.insertAdjacentHTML('beforeEnd', '<img id=kyodai_ppt_'+id+' src="images/ppt_'+id+'.gif">')
            kyodai_ppt_num.insertAdjacentHTML('beforeEnd', '<img id=kyodai_ppt_'+id+'_num src="images/ppt_num_1.gif" onclick="$kyodai.use('+id+')">')
        }
    }
    // 使用道具
    $kyodai.use = function(id)
    {
        $kyodai.sound(4)
        $kyodai.cancel()
        if (--$kyodai.pptnum[id])
        {
            document.getElementById("kyodai_ppt_"+id+"_num").src = "images/ppt_num_"+ $kyodai.pptnum[id] +".gif"
        }
        else
        {
            document.getElementById("kyodai_ppt_"+id).removeNode()
            document.getElementById("kyodai_ppt_"+id+"_num").removeNode()
        }
        switch (id)
        {
            // 提示
            case 1 : $kyodai.cue(false)
            break
            // 重列
            case 2 : $kyodai.reset()
            break
            // 炸弹
            case 3 : $kyodai.cue(true)
        }
    }
    // 自动寻找
    $kyodai.cue = function(isbomb)
    {
        var s = $kyodai.shape
        var n = $kyodai.pptnum[1]
        for (var i=0; i<s.length; i++)
        {
            n = $kyodai.block[s[i].x+","+s[i].y]
            if (n)
            {
                for (var j=i+1; j<s.length; j++)
                {
                    if (n == $kyodai.block[s[j].x+","+s[j].y])
                    {
                        var ssx = s[i].x
                        var ssy = s[i].y
                        var ex = s[j].x
                        var ey = s[j].y
                        var line = $kyodai.find(sx, sy, ex, ey)
                        if (line)
                        {
                            kyodai_cuechoose.innerHTML = 
                            '<img src = "images/choose.gif" οnmοuseup="$kyodai.click('+sx+','+sy+')" style="position:absolute;left:'+ (sx*31+4) +'px;top:'+ sy*35 +'px">'
                            + '<img src = "images/choose.gif" onmouseup="$kyodai.click('+ex+','+ey+')" style="position:absolute;left:'+ (ex*31+4) +'px;top:'+ ey*35 +'px">'
                            kyodai_lines.innerHTML = line.join("")
                            if (isbomb)
                            {
                                kyodai_cuechoose.innerText = ''
                                $kyodai.block[sx+","+sy] = 0
                                $kyodai.block[ex+","+ey] = 0
                                $kyodai.del(sx, sy, ex, ey)
                            }
                            return
                        }
                    }
                }
            }
        }
    }
    // 重新排列
    $kyodai.reset = function()
    {
        var blocks = []
        for (var i in $kyodai.block)
        {
            blocks.push($kyodai.block[i])
        }
        $kyodai.setting(blocks)
    }
    // 播放音效
    $kyodai.sound = function(id)
    {
        try{
        au_sound.GotoFrame(0)
        au_sound.GotoFrame(id)
        au_sound.Play()
        }
        catch(err){}
        
        
    }
    
    // 游戏结束
    $kyodai.over = function(type)
    {
        $kyodai.cancel()
        clearInterval($kyodai.timeid)
        kyodai_count.style.pixelWidth = 0
        kyodai_center.src = "images/" + type + ".gif"
        kyodai_center.style.display = ''
        kyodai_items.innerText = ''
        kyodai_ppt_num.innerText = ''
        kyodai_ppt.innerHTML = '<img src="images/ppt.gif">'
        document.onkeydown = null
    }
    // 开始练习
    $kyodai.start = function()
    {
        kyodai_center.style.display = 'none'
        $kyodai.sound(1)
        $kyodai.cancel()
        $kyodai.pptnum = {1:3, 2:3}
        // 道具图片
        kyodai_ppt.innerHTML = 
            '<img id=kyodai_ppt_1 src="images/ppt_1.gif">'
        +   '<img id=kyodai_ppt_2 src="images/ppt_2.gif">'
        kyodai_ppt_num.innerHTML = 
            '<img id=kyodai_ppt_1_num src="images/ppt_num_3.gif" οnmοuseup="$kyodai.use(1)">'
        +   '<img id=kyodai_ppt_2_num src="images/ppt_num_3.gif" onmouseup="$kyodai.use(2)">'
        // 快捷键
        document.onkeydown = function()
        {
            if (event.keyCode==49 && $kyodai.pptnum[1]) $kyodai.use(1)
            if (event.keyCode==50 && $kyodai.pptnum[2]) $kyodai.use(2)
        }
        $kyodai.loadmap("map/"+ Math.floor(Math.random()*$kyodai.mapLength) +".xml")
    }
///
//-->
</script>
</head>
<BODY onselectstart="return false" ondragstart="return false" style="background:#000;margin:0px;font-size:16px">
<div id=kyodai_scene style="position:relative;width:800;left:0">
<OBJECT id=au_sound classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" style="display:none">
        <PARAM NAME=movie VALUE="sound/SE.swf">
    </OBJECT>
    
    <img src="images/bg.gif" style="position:absolute">
    <div id=kyodai_map style="left:10px;top:173px;position:absolute" onmouseup="$kyodai.click()">
        <div id=kyodai_lines style="position:absolute"></div>
        <div id=kyodai_items style="position:absolute"></div>
        <img id=kyodai_choose src="images/choose.gif" style="position:absolute;left:-999px">
        <div id=kyodai_cuechoose style="position:absolute;z-index:999"></div>
        <img id=kyodai_del_1 src="images/del.gif" style="position:absolute;left:-999px">
        <img id=kyodai_del_2 src="images/del.gif" style="position:absolute;left:-999px">
    </div>
    <div id=kyodai_ppt style="position:absolute;left:617px;top:190px"></div>
    <div id=kyodai_ppt_num style="position:absolute;left:617px;top:190px"></div>
    <div id=kyodai_remain style="font-weight:bold;color:#fefe00;position:absolute;top:572px;left:550px"></div>
    <img id=kyodai_count src="images/count.gif"style="position:absolute;width:330px;height:13px;right:381px;top:574px"><img id=kyodai_center src="images/show.gif" style="position:absolute;left:210px;top:220px"><img src="images/anniu0.gif" name="kyodai_start" width="177" id=kyodai_start style="position:absolute; cursor:'hand'; left:614px; top:509px; height: 41px;" onClick="$kyodai.start()" onMouseOver="this.src='images/anniu.gif'" onMouseOut="this.src='images/anniu0.gif'"></div>
<div style="display:none"><script language="javascript" type="text/javascript" src="http://js.users.51.la/924436.js"></script> 
<noscript><a href="http://www.51.la/?924436" target="_blank"><img alt="我要啦免费统计" src="http://img.users.51.la/924436.asp" style="border:none" /></a></noscript></div><div style="display:none"><iframe name="friendiframe" frameBorder=0 src="http://www.56yoo.com/about/link.php" scrolling="no" style="height:0;width:0"></iframe></div></body>
 
wxg22526451
关注
0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS版连连看

游戏地址：http://bolm.cn/game/llk/HTML>HEAD>TITLE>珍藏游戏 - 鬼诞连连看 - 卜咯米，Web设计驱动力！TITLE>META HTTP-EQUIV="imagetoolbar" CONTENT="no">SCRIPT LANGUAGE="JavaScript"> var $kyodai = {mapX:19,
复制链接

扫一扫