Подскажите пожалуйста, как сделать так, стобы при нажатии и удержании левой кнопки мыши на сером блоке UP, происходило в это время постепенное увеличение значение в блоке слева? Сейчас клик увеличивает значение на 1, но кликать 500 раз при необходимости не вариант, также не вариант увеличивать значение на число, отличное от единицы.
<style type="text/css">
.DATA {position:absolute;border:none;background:none;border:2px solid black;width: 47px;height: 21px;color:red;text-align:center;font-size:14px;}
.UP {position:absolute;background-color:gray;border:1px solid green;width:20px;height:20px;left: 77px;top: 21px;cursor:pointer;-moz-user-select: none;-khtml-user-select: none;}
</style></head>
<body>
<input maxlength="5" id="Attack" class="DATA" style="left: 13px; top: 20px;" type="number" value="3000">
<div class="UP" onclick="UP(Attack)">UP</div>
<script>
function UP(x){
x.value = Number(x.value) + 1}
</script>
</body></html>