sortable怎么用到table上,我想拖动单元格,做拼图游戏
sortable怎么用到table上,我想拖动单元格,做拼图游戏
sortable怎么用到table上,我想拖动单元格,做拼图游戏
2014-12-31
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>拖曳排序插件</title> <link href="style.css" rel="stylesheet" type="text/css" /> <script src="http://www.imooc.com/data/jquery-1.8.2.min.js" type="text/javascript"></script> <script src="http://www.imooc.com/data/jquery-ui-1.9.2.min.js" type="text/javascript"></script> </head> <body> <div id="divtest"> <div class="title"> <span class="fl">我最喜欢的运动</span> </div> <div class="content"> <table id="ul"> <tbody> <tr> <td>1)足球</td> <td>2)散步</td> </tr> <tr> <td>4)乒乓球</td> <td>3)篮球</td> </tr> <tr> <td>5)骑自行车</td> </tr> </tbody> </table> </div> </div> <script type="text/javascript"> $(function () { $("tbody").sortable().disableSelection(); $("tr").sortable().disableSelection(); }); </script> </body> </html>
反复实验,发现由于table的line之间存在关联,所以你要么就拖动一整行,要么就在一行之内拖动列;
做拼图游戏的方法应该还是用list,你只要把list的<li>的display设置为:inline-block即可.
举报