围格子游戏

作者：佚名来源：不详发布时间：2006-10-29 0:14:47 发布人：admin

<--网页特效代码由<a target="_blank" href=http://js.9966ok.com>http://js.9966ok.com</a>提供！-->
<head><Script>
function ShowMenu(bMenu) {
document.all.idFinder.style.display = (bMenu) ? "none" : "block" 
document.all.idMenu.style.display = (bMenu) ? "block" : "none"
idML.className = (bMenu) ? "cOn" : "cOff"
idRL.className = (bMenu) ? "cOff" : "cOn"
return false
}
</script>
<Script>
<--
function addList(url,desc) {
if ((navigator.appName=="Netscape") || (parseInt(navigator.appVersion)>=4)) {
var w=window.open("","_IDHTML_LIST_","top=0,left=0,width=475,height=150,history=no,menubar=no,status=no,resizable=no")
var d=w.document
if (!w._init) {
d.open()
d.write("<TITLE>Loading...</TITLE><EM>Loading...</EM>")
d.close()
d.location.replace("/assist/listing.asp?url="+escape(url)+"&desc="+escape(desc))  
w.opener=self    
window.status="Personal Assistant (Adding): " + desc
} else {
window.status=w.addOption(url,desc)    
w.focus()
}
}
else
alert("Your browser does not support the personal assistant.")
return false
}
// -->
</Script>
<style>
<--
A.cOn {text-decoration:none;font-weight:bolder}
#article {font: 12pt Verdana, geneva, arial, sans-serif;  background: white; color: black; padding: 10pt 15pt 0 5pt}
#article P.start {text-indent: 0pt}
#article P {margin-top:0pt;font-size:10pt;text-indent:12pt}
#article #author {margin-bottom:5pt;text-indent:0pt;font-style: italic}
#pageList P {padding-top:10pt}
#article H3 {font-weight:bold}
#article DL, UL, OL {font-size: 10pt}
-->
</style>
<style>
#board {font-family: arial}
.dot {position: absolute; width: 5px; height: 5px; font-size: 0pt; background: black}
#line {position: absolute; font-size: 0pt; height: 5px}
.p1 {position: absolute; font-size: 0pt;background: navy}
.p2 {position: absolute; font-size: 0pt;  background: red}
.p1B {position: absolute; font-size: 8pt; color: navy;text-align: center; font-weight: bold}
.p2B {position: absolute; font-size: 8pt; color: red; text-align: center; font-weight: bold}
</style></head><body><table width="90%" border="1">
              <tr> 
                <td>
                  <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr> 
                      <td width="44%" height="11" align="center"><font color="#FF0000"><b>红方得分：</b></font></td>
                      <td id="red" height="11" width="6%">0</td>
                      <td width="44%" height="11" align="center"><font color="#0000CC"><b><font color="#003399">蓝方得分：</font></b></font></td>
                      <td id="navy" height="11" width="6%">0</td>
                    </tr>
                  </table>
                </td>
                <td>
                  <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr> 
                      <td width="35%" align="right">游戏大小:</td>
                      <td width="15%"> 
                        <input type="Text" value="5" id="setSize" size="2" name="Text2">
                      </td>
                      <td align="center" width="50%"> 
                        <input type="button" onClick="createGame()"
          value="重新开始" name="button2">
                      </td>
                    </tr>
                  </table>
                </td>
              </tr>
              <tr> 
                <td colspan="2">
                  <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr align="center"> 
                      <td height="30"> 
                        <p class="start" id="message">蓝方先走!!!</p>
                      </td>
                    </tr>
                    <tr align="center"> 
                      <td> 
                        <Script>
  /* DHTML Dots is copyright 1998 insideDHTML.com, LLC. All rights reserved.
     DHTML Dots cannot be reproduced in any manner without prior consent from insideDHTML.com */

var scale= 25
  var size = 5

var totalSize = ((size+1)*scale) + 6
  var cache = new Object()
  var move=0,point=0
  var player = true

function initCache() {
    cache.x = 0
    cache.y = 0
    cache.red = 0
    cache.navy = 0
    move=0,point=0    
  }

function updateScore() {
    document.all.red.innerText = cache.red
    document.all.navy.innerText = cache.navy
    if ((cache.red+cache.navy)==((size-1)*(size-1))) {
      board.onclick = null
      document.all.message.innerText = "游戏结束!"
    }
     
  }

function fillPos(x,y) {
    document.all.board.insertAdjacentHTML("beforeEnd","<DIV class=" + (player ? "p1B" : "p2B") + " ID=\"point"+point+"\">" + (player ? "N" : "R") + "</DIV>")
    var el = document.all["point"+point].style
    el.pixelTop = (y*scale)+5
    el.pixelLeft = (x*scale)+5
    el.pixelWidth = scale - 5
    el.pixelHeight = scale - 5

}

function checkBoard(x,y,dir, player) {
    var piece=0
    if ("vertical"==dir) {
      if ((x==size) || (x>1)) {
        var bPos = boardArray[x-1][y]
        var nextV = boardArray[x-1][y+1]
        if ((bPos["vertical"]) && (bPos["horizontal"]) && (nextV["horizontal"])) {
          point++
          piece++
          fillPos(x-1,y)
        }
      } 
      if ((x==1) || (x<size)) {
          var nextV = boardArray[x+1][y]
          var nextH = boardArray[x][y+1]
          if ((nextV["vertical"]) && (nextH["horizontal"]) && (boardArray[x][y]["horizontal"])) {
            point++
            piece++
            fillPos(x,y)
          }
      }   
    }    
    else {
      if ((y==size) || (y>1)) {
        var nextV = boardArray[x+1][y-1]
        var bPos = boardArray[x][y-1]
        if ((bPos["vertical"]) && (bPos["horizontal"]) && (nextV["vertical"])) {
          point++
          piece++
          fillPos(x,y-1)
        } 
      }
      if ((y==1) || (y<size)) {
        var nextV = boardArray[x+1][y]
        var nextH = boardArray[x][y+1]
        if ((nextV["vertical"]) && (nextH["horizontal"]) && (boardArray[x][y]["vertical"])) {
          point++
          piece++
          fillPos(x,y)
        }
      }
    } 
    if (piece>0) {
      if (player)
       cache.navy+=piece
      else
       cache.red+=piece
      document.all.message.innerText = "得分! 继续走."
      updateScore()
      return player
    }
    else
      return !player
        
  }

function doMouseMove() {
    if (event.srcElement.className!="dot") {
      var x = Math.floor(event.offsetX / scale) 
      var y = Math.floor(event.offsetY / scale) 
      var dirX = (event.offsetX % scale)
      var dirY = (event.offsetY % scale)
      if ((x<size+1) && (y<size+1) && (y>0) && (x>0)) {
        if (dirX>=dirY) {
          if (x<size) {
            line.style.pixelHeight = 5 
            line.style.pixelWidth = scale  - 5
            line.style.pixelTop = (y * scale) 
            line.style.pixelLeft = (x * scale) + 5
            cache.direction = "horizontal"
          }
        } else
        {
          if (y<size) { 
            line.style.pixelWidth = 5 
            line.style.pixelHeight = scale - 5
            line.style.pixelTop = (y * scale) + 5
            line.style.pixelLeft = x * scale
            cache.direction = "vertical"
          }
        }
        cache.x = x
        cache.y = y
      }
    }
    
  }

function doClick() {

if (cache.x==0) return
    if (boardArray[cache.x][cache.y][cache.direction])
      document.all.message.innerText="错误!请重新选择。"
    else {
      document.all.board.insertAdjacentHTML("beforeEnd","<DIV class=" + (player ? "p1" : "p2") + " ID=move"+move+"></DIV>")
      var el = document.all["move"+move]
      el.style.top = line.style.top 
      el.style.left = line.style.left 
      el.style.width = line.style.width
      el.style.height = line.style.height
      boardArray[cache.x][cache.y][cache.direction]=true
      var nextPlayer = checkBoard(cache.x,cache.y,cache.direction, player)
      if (nextPlayer!=player) {
        player = nextPlayer
        if (player) {
          document.all.message.innerText = "轮到蓝方走"
          line.style.border = "1px navy solid"
        }
        else {
          document.all.message.innerText = "轮到红方走"
          line.style.border = "1px red solid"
        }
      }
    }

move++
  }

function buildDiv(x,y, scale) {
    return ("<DIV CLASS=dot STYLE=\"top:" +  (x*scale) + "; left: " + (y*scale) + "\"></DIV>")
  }

var boardArray = new Object

function buildBoard() {
    initCache()
    board = ("<DIV ID=line STYLE=\"border: 1px navy solid; width: 0; height: 0\"></DIV>")
    boardArray = new Object()
    for (var x=1; x < size+1; x++) {
      boardArray[x] = new Object()
      for (var y=1; y < size+1; y++) {
        boardArray[x][y] = new Object
        boardArray[x][y]["vertical"] = false
        boardArray[x][y]["horizontal"] = false
        board+=(buildDiv(x,y, scale))
      }
    }

return board
  }

function createGame() {
    size=parseInt(document.all.setSize.value)
    if (size>12)
      size=12
    if (size<3)
      size=3
    document.all.setSize.value = size
    document.all.board.innerHTML = buildBoard()
    document.all.board.onclick = doClick
    totalSize = ((size+1)*scale) + 6
    document.all.board.style.pixelWidth = totalSize
    document.all.board.style.pixelHeight = totalSize
    document.all.message.innerText = "蓝方先走!!!"
    updateScore()    
  }
  document.write("<DIV ID=board STYLE=\"position: relative; height: "+ totalSize + "; width:" + totalSize + "; border: 1px black solid\">" + buildBoard() + "</DIV>")
  document.all.board.onmousemove = doMouseMove
  document.all.board.onclick = doClick

</Script>
                      </td>
                    </tr>
                    <tr> 
                      <td> </td>
                    </tr>
                  </table>
                </td>
              </tr>
              <tr> 
                <td colspan="2">游戏提示：此游戏为一双人游戏，蓝方先走，看谁围的格子多。</td>
              </tr>
            </table></body>

特别说明：如网页特效代码中有引用图片文件等，请自己下载到本地调试！

[] [返回] [打印] [收藏] [评论]

上一篇代码：贪吃蛇游戏

下一篇代码：虚拟抽奖小特效！

围格子游戏

精品推荐

代码分类

阅读排行

相关代码