• [转]JS小游戏_点灯


    转自:http://www.jshtml.cn/jsgame/jsgame_20080310141951.html

    <html>
    <head>
    <title>网页特效|网页特效代码(JsHtml.cn)---js制作动脑小游戏</title>
    <style type="text/css">
    <!--
    body {  font-family: "宋体"; font-size: 9pt; margin-top: 0px; margin-left: 0px; margin-right: 0px}
    A { COLOR: black; FONT-SIZE: 13px; FONT-WEIGHT: 400; TEXT-DECORATION: none }
     A:hover { COLOR: red; FONT-SIZE: 13px; FONT-WEIGHT: 400; TEXT-DECORATION: underline }
    a:active     { font: 9pt "宋体"; cursor: hand; color: #FF0033 }
    -->
    </style>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <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>
    <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>
    <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>
        #board {cursor: default}   
        #board TD { 25px; height: 25px; }
      </style>
    </head>
    <body>
    <script>
        var size=10
        var moves = 0
        var off = size*2
        var on = 0
        var current = null
        function doOver() {
          if ((event.srcElement.tagName=="TD") && (current!=event.srcElement)) {
            if (current!=null)
              current.style.backgroundColor = current._background
            event.srcElement._background = event.srcElement.style.backgroundColor
            event.srcElement.style.backgroundColor = "lightgrey"
            current = event.srcElement
          }
        }
        function setColor(el) {
          if ((el._background=="") || (el._background==null)) {
            el.style.backgroundColor = "yellow"
            el._background = "yellow"
          } else {
            el.style.backgroundColor = ""
            el._background = ""
          }
        }
        function countLights() {
          off = 0; on = 0
          for (var x=0; x < size; x++)
            for (var y=0; y < size; y++) {
              var p = board.rows[x].cells[y]
              if (p._background=="yellow")
                on++
              else
                off ++
            }
            document.all.on.innerText = on
          if (off!=0)    
            document.all.off.innerText = off
          else
            document.all.off.innerText = "You Win!"
          return (off==0)
        }
        function doClick() {
          setColor(current)    
          var cellIdx = current.cellIndex
          var rowIdx = current.parentElement.rowIndex
          if (rowIdx>0)
            setColor(board.rows[rowIdx-1].cells[cellIdx])
          if (rowIdx<size-1)
            setColor(board.rows[rowIdx+1].cells[cellIdx])
          if (cellIdx>0)
            setColor(board.rows[rowIdx].cells[cellIdx-1])
          if (cellIdx<size-1)
            setColor(board.rows[rowIdx].cells[cellIdx+1])
          moves++
          document.all.moves.innerText = moves
          win = countLights()
          if (win) {
            board.onclick = null
            board.onmouseover = null
            current.style.background = "yellow"
          }
        }
        function buildBoard() {
          var str = "<TABLE ID=board ONSELECTSTART=\"return false\" ONCLICK=\"doClick()\" ONMOUSEOVER=\"doOver()\" cellspacing=0 cellpadding=0 border=5>"
          for (var x=0; x < size; x++) {
            str+="<TR>"
            for (var y=0; y < size; y++) {
              str+="<TD> </TD>"
            }
            str+="</TR>"
          }
          str+="</TABLE>"
          return str
        }
        function newGame() {
          size = document.all.gameSize.value
          if (size<3)
            size=3
          if (size>15)
            size=15
          document.all.gameSize.value = size
          document.all.board.outerHTML = buildBoard()
          moves=0
          document.all.moves.innerText = moves
          countLights()
     
        }
       
      </script>
    <br>
    <br>
    <center><font color=red face="隶书" size=6>动脑小游戏</font></center>
    <br>
    <center>
    <br>
    <br>
    <center>
    <table border=0 bordercolor=blue borderlight=green style="border-collapse: collapse" cellpadding="0" cellspacing="0">
    <tr><td align=center> </td></tr><tr><td align=center height=100>
    <p align="center"><big><font color="#0000FF">在方格上点击,你可以将下面的方格全部填成黄色吗</font><strong><font
    color="#FF0000"><big><big>?</big></big></font></strong></big></p>
    <p align="center"><font color="#0000FF">快开动你智慧脑筋,看看有什么技巧与规律。</font></p>
    <table border="1" width="100%">
      <tr>
        <td width="50%"><div align="right"><table ID="score" border="0" width="284">
          <tr>
            <td width="52">移动: </td>
            <td id="moves" width="33">0</td>
            <td width="42">灯灭:</td>
            <td id="off" width="36">25</td>
            <td width="46">灯亮:</td>
            <td id="on" width="39">0</td>
          </tr>
        </table>
        </div></td>
        <td width="50%"><div align="left"><table width="204">
          <tr>
            <td width="54">大小: </td>
            <td width="41"><input ID="gameSize" TYPE="text" VALUE="10" SIZE="2"></td>
            <td width="97"><input ONCLICK="newGame()" TYPE="button" VALUE="开始游戏"></td>
          </tr>
        </table>
        </div></td>
      </tr>
    </table>
    <p align="center"><script>
        document.write(buildBoard())
      </script></p>
    </td></tr>
    </table></center>
    <br>
    <br>
    <br>
    <br>
    </body>
    </html>

  • 相关阅读:
    linux 删除某种规则命名的文件
    adb shell 出现 error :
    android 开发,多个线程共用一个handler
    android 开发上传图片遇到返回 FileNotFoundException
    mysql 的存储过程调试软件
    输入adb shell 时 提示error: more than one device and emulator
    高德开发 android 出现 key 鉴权失败
    android 中设置HttpURLConnection 超时并判断是否超时
    LINQ to SQL语句(3)之Count/Sum/Min/Max/Avg
    C# 如何判断数据是否为 NaN
  • 原文地址:https://www.cnblogs.com/xjyggd/p/1347498.html
Copyright © 2020-2023  润新知