02c.htm

javascript94个网页特效下载

        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>
            &lt;/table&gt;</textarea>
                  </td>
                </tr>
              </table>
            </td>
          </tr>
          <tr> 
            <td height="20" class="white" bgcolor="#009900">当前位置:<a href="../../index.htm">首 
              页</a><a href="../index.htm">→JavaScript</a>→<a href="index.htm#2">智力游戏</a>→围格子</td>
          </tr>
        </table>
        <br>
      </td>
      <td bgcolor="#009900" width="18"></td>
    </tr>
    <tr bgcolor="#009900"> 
      <td></td>
      <td align="center" height="35"> <font color="#FFFFFF">··万旭网站工作室 设计发布··</font> 
      </td>
      <td>&nbsp;</td>
    </tr>
  </table>
</form>
</body>
</html>