用js将图片分成m*n个矩形块

这是效果图:
用js将图片分成m*n个矩形块上代码!!
HTML

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>生成图片碎片</title>
	
	<script src="碎片.js"></script>
	<link rel="stylesheet" href="碎片.css">
</head>
<body>
	<input type="text" value="1" id="m">
	<input type="text" value="1" id="n">
	<input type="button" value="click" onClick="makeFragments()">
	
	<div id="fragments"></div>
</body>
</html>

css:

@charset "utf-8";
/* CSS Document */

#fragments{
	width: 798px;
	height: 498px;
}

#fragTable{
	width: 798px;
	height: 498px;
	border-collapse: collapse;
}

JS:

// JavaScript Document
function makeFragments(){
	    //生成m*n个div元素
	    var m = document.getElementById("m").value;
	    var n = document.getElementById("n").value;
	    var frags = "<table id = 'fragTable' border='0'>";
	    
	    for(var i = 0; i < m; i++){
            frags += "<tr>";
	    	for(var j = 0; j < n; j++){
	    		frags += "<td><div id='div"+i+j+"'></div></td>";
	    	}
			frags += "</tr>";
	    }
	
	frags += "</table>";
	
	document.getElementById("fragments").innerHTML = frags;
	
	addImage();
}

//为每个div添加背景图片
function addImage(){
	 var m = document.getElementById("m").value;
	 var n = document.getElementById("n").value;
	    
	 for(var i = 0; i < m; i++){
		 for(var j = 0; j < n; j++){
			 var curdiv=document.getElementById("div"+i+j);
			 var wid = 798;
			 var hgt = 498;
			 curdiv.style.background="url(../images/bizhi.jpg) no-repeat scroll";	
		     curdiv.style.backgroundSize="798px 498px";
			 
			 curdiv.style.width=(wid/n)+"px";
			 curdiv.style.height=(hgt/m)+"px";
			 
			 curdiv.style.backgroundPosition=getInverse(j*(wid/n))+
				 "px"+' '+getInverse(i*(hgt/m))+"px";
			 
		 }
	 }
}

//取相反数
function getInverse(num){
	return (0-num);
}