mmとppi値からpixel値が求められたので、pixelとppi値からmm値を求めてみます。
mm = pixel × 25.4 ÷ dpi
は前回からの変更箇所。
前回のソースから削除されている部分もあります。
<!-- index.html -->
<!DOCTYPE html>
<html>
<head>
<title>pixel to mm Conversion</title>
<link rel="stylesheet" type="text/css" href="links/rule.css">
</head>
<body bgcolor="#696969">
<script src="links/action.js"></script>
<center>
<div id="main_box">
<br>
<font size="4">pixelとppi指定でmm値を計算</font>
<p>
<input type="text" id="pixelInput" size="5"
style="text-align:right">	pixel  
<input type="text" id="ppiInput" size="5"
style="text-align:right">	ppi  
<button onclick="convertPixelToMM()"
style="background-color: #00ffff">変換計算</button>  
<button onclick="window.location.reload();"
style="background-color: #ffc0cb">リセット</button>
</p>
<p id="result"></p>
</div>
</center>
</body>
</html>
<!-- index.html -->
/* rule.css */
div#main_box {
height: 150px;
width: 500px;
background: #f0fff0; /* honeydew */
margin: 50px auto;
}
/* rule.css */
/* action.js */
function convertPixelToMM() {
var pixelValue =
parseFloat(document.getElementById("pixelInput").value);
var ppi =
parseFloat(document.getElementById("ppiInput").value);
if (!isNaN(pixelValue) && !isNaN(ppi)) {
var mmValue = (pixelValue * 25.4 ) / ppi;
var formattedMMValue = mmValue.toFixed(2);
document.getElementById("result").textContent =
ppi + "ppiの " + pixelValue +
"pixelは\u3000凡そ "+ formattedMMValue + "mm";
} else {
document.getElementById("result").textContent =
"無効な入力です。pixelとppiに有効な数値を入力してください。";
}
}
/* action.js */
前回の・・・
HTMLのコーディングは一気に設計すると奈落に落ちます（05）2023/08/27
との差異を確認してください。
