Change comma height and width with mask

Question

I have a code that calculates the amount of rolls needed according to the width and height of the person’s wall. Currently the code for the mask of the comma is this:

        $('.virgula').mask('####00,00', {reverse: true});

        $("#altura").focusout(function (){
            try{
                var altura = parseFloat( $("#altura").val().replace(',','.') );
                var largura = parseFloat( $("#largura").val().replace(',','.') );
                var divisor = 1.20;
                var resultado = largura / divisor;

That is, when the person type "1" and "5" the number appears as 15 meters and only after she type "0" does it appear 1.50 meters.

I wonder if there is the possibility of the number appearing as "1,5" with two digits, as if the mask was "#0,0" and after two digits it goes back to the mask "#####00,00". I’ve tried some Ifs and nothing.

Answer 1

You can change the mask onKeyUp, counting the characters that exist in the input:

$('.virgula').mask('#####0,0', {reverse: true});

$('.virgula').on('keyup', function() {
  if( $(this).val().length > 3 ) {
      mascara = '####00,00';
  } else {
    mascara = '####0,0';
  }
  
  $('.virgula').mask( mascara, { reverse: true});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.mask/1.14.0/jquery.mask.js"></script>

<input type="text" name="valor" class="virgula" />