Veterinar,
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Resizable</title>
<link type="text/css" rel="stylesheet" href="http://sven-soft.com/css/ui-lightness/jquery-ui-1.10.3.custom.min.css">
<style type="text/css">
*{
margin:0;
padding:0;
}
#run_resise{
position:absolute;
top:40px;
height:16px;
width:32px;
background:#ccf;
}
</style>
<script type="text/javascript" src="http://sven-soft.com/js/jquery-1.9.1.js"></script>
<script type="text/javascript" src="http://sven-soft.com/js/jquery-ui-1.10.3.custom.min.js"></script>
<script type="text/javascript">
$(function () {
$('#run_resise').resizable({
grid: [32, 16],
minWidth: 32,
minHeight: 16,
stop: function (event, ui) {
$('#order_width').val(ui.size.width * 10);
$('#order_height').val(ui.size.height * 10);
}
});
});
</script>
</head>
<body>
<input type="number" name="order_width" id="order_width" size="7" min="320" max="100000" step="320" value="320"/>
<input type="number" name="order_height" id="order_height" size="7" min="160" max="100000" step="160" value="160"/>
<div id="run_resise" ></div>
</body>
</html>