javascript 像素拼图实现代码_javascript技巧

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>JavaScript像素拼图游戏</title> <style type="text/css" media="all"> body{ margin:0px; padding:0px; background-color:#111111; font-family:Arial, Helvetica, sans-serif,"宋体"; } .container{ background-color:#CCCCCC; padding:0px 0px 0px 1px; width:609px; margin:0px auto; font-size:12px; height:auto; overflow:hidden; } .container .line,.container .line2{ width:100%; height:auto; overflow:hidden; } .container .line2 a{ color:#ababab; background-color:#666666; } .container a{ display:block; float:left; background-color:#999999; margin-right:1px; margin-top:1px; width:28px; text-align:center; padding:4px 0px; text-decoration:none; color:#FFFFFF; font-weight:bold; cursor:pointer; } .caption{ margin:0px auto; width:608px; height:auto; overflow:hidden; padding:1px; background-color:#CCCCCC; } .caption h2{ margin:0px; padding:3px; text-align:center; font-size:12px; background-color:#666666; } .caption ul{ margin:0px; padding:0px 16px; list-style:none; line-height:22px; font-size:12px; } .inputtxt{ width:30px; height:12px; font-size:12px; color:#FF6600; font-weight:bold; text-align:center; } .inputbutton{border:#666666 1px solid;height:18px;} .caption ul a{color:#333333;} .caption ul li{ border-bottom:#666666 1px dashed; } </style> <div class="caption" id="caption"> <h2>说明</h2> <ul> <li>1.移动鼠标在网页方格里点击，拼出图形。</li> <li>2.如果对某个点不满意，再次点击，即可消除。</li> <li>3.如果想重新开始，请点击这里：<input type="button" value="重新开始" class="inputbutton"> 或者重新设置：<input type="text" class="inputtxt"> 列 <input type="text" class="inputtxt"> 行 <input type="button" value="重新生成" class="inputbutton"> </li> </ul> </div>
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]