Question

我有一个100毫米x 100毫米<div>。

当我致电.resizable()时，此<div>正在转变为像素值。

当它改变大小时，我应该怎么做才能 mm ？

我所做的示例代码如下：

$(document).ready(function() {
  $('#div1').resizable().draggable();


  (function($) {
    $.fn.toMillimeters = function() {
      var element = this,
        width = parseInt(element.css('width')),
        height = parseInt(element.css('height')),
        millimeters = {};
      millimeters.width = Math.floor(width * 0.264583);
      millimeters.height = Math.floor(height * 0.264583);

      return millimeters;
    };
  })(jQuery);

  $(function() {
    var mmLength = $('#div1').toMillimeters();
    $('#output').text('Width: ' + mmLength.width + ' mm ' +
      'Height: ' + mmLength.height + ' mm');
  });


});

<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script type="text/javascript" src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script type="text/javascript" src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js"></script>
<link rel="stylesheet" type="text/css" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css">
<div id="output" style="height: 10mm; width: 80mm; background-color: #5bc0de"></div>
<div id="div1" style="width:80mm; height:80mm; background-color:#9d9d9d">
</div>

Answer 1

试试这个公式：

  millimeters.width = Math.floor((width * 25.4) / dpi);
  millimeters.height = Math.floor((height * 25.4) / dpi);

将px转换为mm并保持mm

1 个答案: