2014-01-10 33 views
1

我想要做的就是創建像「遊戲」這樣的象棋。你應該能夠自由地拖動符號,就像你可以在網上找到的象棋助手一樣。真的很簡單。我可以使用JS拖動符號嗎?

但我的問題是移動的符號,是否有人能夠幫助?

`<!DOCTYPE html> 
<html> 
<head> 
    <style> 
     html, body { 
      width:100%; 
      height:100%; 
     } 

     .black { 
      background-color:silver; 

     } 

     table { 
      margin:auto; 
      text-align:center; 
     } 
    </style> 
</head> 
    <body> 
     <table border="1" style="border:1px black solid;"> 
      <tr> 
       <td width="40px" height="40px">&#9820;</td> 
       <td class="black" width="40px" height="40px">&#9822;</td> 
       <td width="40px" height="40px">&#9821;</td> 
       <td class="black" width="40px" height="40px">&#9819;</td> 
       <td width="40px" height="40px">&#9818;</td> 
       <td class="black" width="40px" height="40px">&#9821;</td> 
       <td width="40px" height="40px">&#9822;</td> 
       <td class="black" width="40px" height="40px">&#9820;</td> 
      </tr> 
      <tr> 
       <td class="black" width="40px" height="40px">&#9823;</td> 
       <td width="40px" height="40px">&#9823;</td> 
       <td class="black" width="40px" height="40px">&#9823;</td> 
       <td width="40px" height="40px">&#9823;</td> 
       <td class="black" width="40px" height="40px">&#9823;</td> 
       <td width="40px" height="40px">&#9823;</td> 
       <td class="black" width="40px" height="40px">&#9823;</td> 
       <td width="40px" height="40px">&#9823;</td> 
      </tr> 
      <tr> 
       <td width="40px" height="40px"></td> 
       <td class="black" width="40px" height="40px"></td> 
       <td width="40px" height="40px"></td> 
       <td class="black" width="40px" height="40px"></td> 
       <td width="40px" height="40px"></td> 
       <td class="black" width="40px" height="40px"></td> 
       <td width="40px" height="40px"></td> 
       <td class="black" width="40px" height="40px"></td> 
      </tr> 
      <tr> 
       <td class="black" width="40px" height="40px"></td> 
       <td width="40px" height="40px"></td> 
       <td class="black" width="40px" height="40px"></td> 
       <td width="40px" height="40px"></td> 
       <td class="black" width="40px" height="40px"></td> 
       <td width="40px" height="40px"></td> 
       <td class="black" width="40px" height="40px"></td> 
       <td width="40px" height="40px"></td> 
      </tr> 
      <tr> 
       <td width="40px" height="40px"></td> 
       <td class="black" width="40px" height="40px"></td> 
       <td width="40px" height="40px"></td> 
       <td class="black" width="40px" height="40px"></td> 
       <td width="40px" height="40px"></td> 
       <td class="black" width="40px" height="40px"></td> 
       <td width="40px" height="40px"></td> 
       <td class="black" width="40px" height="40px"></td> 
      </tr> 
      <tr> 
       <td class="black" width="40px" height="40px"></td> 
       <td width="40px" height="40px"></td> 
       <td class="black" width="40px" height="40px"></td> 
       <td width="40px" height="40px"></td> 
       <td class="black" width="40px" height="40px"></td> 
       <td width="40px" height="40px"></td> 
       <td class="black" width="40px" height="40px"></td> 
       <td width="40px" height="40px"></td> 
      </tr> 
      <tr> 
       <td width="40px" height="40px">&#9817;</td> 
       <td class="black" width="40px" height="40px">&#9817;</td> 
       <td width="40px" height="40px">&#9817;</td> 
       <td class="black" width="40px" height="40px">&#9817;</td> 
       <td width="40px" height="40px">&#9817;</td> 
       <td class="black" width="40px" height="40px">&#9817;</td> 
       <td width="40px" height="40px">&#9817;</td> 
       <td class="black" width="40px" height="40px">&#9817;</td> 
      </tr> 
      <tr> 
       <td class="black" width="40px" height="40px">&#9814;</td> 
       <td width="40px" height="40px">&#9816;</td> 
       <td class="black" width="40px" height="40px">&#9815;</td> 
       <td width="40px" height="40px">&#9813;</td> 
       <td class="black" width="40px" height="40px">&#9812;</td> 
       <td width="40px" height="40px">&#9815;</td> 
       <td class="black" width="40px" height="40px">&#9816;</td> 
       <td width="40px" height="40px">&#9814;</td> 
      </tr> 
     </table> 
    </body> 

`

回答

相關問題