江西省国防科技工业学校9846班
高级搜索|网站地图|TAG标签RSS订阅[设为首页] [加入收藏]

网会阁

搜索

热门标签:

当前位置: 本站首页 > HTML网页特效

08动脑小游戏

时间:2024-10-28 16:17来源:未知 作者:admin 点击: 次
html head title动脑小游戏/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 }

<html>

<head>

<title>动脑小游戏</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 {width: 25px; height: 25px; }

 </style>

</head>

<body bgcolor="#fef4d9">

<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=5 bordercolor=blue borderlight=green>

<tr><td align=center><font size=5 color=red face="Arial, Helvetica, sans-serif"><strong>下面为效果显示区!</strong></font></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>

<center>

<textarea name=source rows=12 cols=45 class=yk9>

脚本说明:

第一步:把如下代码加入<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>


<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 {width: 25px; height: 25px; }

 </style>




第二步:把如下代码加入<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>

 <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>

 </textarea>

<SCRIPT LANGUAGE="JavaScript">


<!-- hide


function goHist(a)


{


  history.go(a);


}


//-->


</script>


<FORM METHOD="post">

<INPUT TYPE="button" VALUE="返回" onClick="goHist(-1)" style="background-color: #8000FF; color: rgb(255,255,255)">

</form>

</center>

<br>

<br>

</body>

</html>

(责任编辑：admin)
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规，严禁发布色情、暴力、反动的言论。
评价:
表情:
用户名: 验证码:点击我更换图片
最新评论 进入详细评论页>>
栏目列表
推荐内容
热点内容

Powered by DedeCMS_V57_UTF8_SP2_115 © 2004-2024 DesDev Inc.

特别感谢：卓卓网络的织梦自助建站模板
--------------------------------------------------------------------------------------------------------------
@1998-2024 网会阁
QQ:107698961
EMAIL:jx9846@163.com
http://www.jx9846.net
江西省国防科技工业学校9846班   

本站页面浏览总量:次