• js根据毫米/厘米算像素px


    <html>
    <meta http-equiv="content-type" content="text/html;charset=utf-8">
    <body>


    纸张宽度(毫米mm):<input type="text" id="width" value="10"> <span id="width_px"></span>
    <br>纸张宽度(毫米cm):<input type="text" id="height" value="10"> <span id="height_px"></span>
    <br><input type="button" value="计算" onclick="compute(1)">
    <input type="button" value="计算And画格子" onclick="compute(2)">
    <input type="button" value="一键生成多个格子(生成以后可以打印出来在纸上用尺子量一下对不对)" onclick="make()">
    <br><br>
    <div id="testDiv">
    <div id="testDiv1"></div>
    </div>
    </body>
    <script>
    function make(){
    document.getElementById("width").value=10;
    compute(2);
    document.getElementById("width").value=20;
    compute(2);
    document.getElementById("width").value=30;
    compute(2);
    document.getElementById("width").value=40;
    compute(2);
    document.getElementById("width").value=60;
    compute(2);
    document.getElementById("width").value=80;
    compute(2);
    document.getElementById("width").value=100;
    compute(2);
    document.getElementById("width").value=150;
    compute(2);
    }

    function compute(t){
    var width=document.getElementById("width").value;
    var height=document.getElementById("height").value;
    console.log(""+width)
    console.log("height:"+height)
    var width_px=cm2px(width);
    var height_px=cm2px(height);
    console.log("width_px:"+width_px)
    console.log("height:"+height)
    document.getElementById("width_px").innerHTML=width_px+" px";
    document.getElementById("height_px").innerHTML=height_px+" px";

    if(t==2){
    var tmpNode = document.createElement("DIV");
    tmpNode.setAttribute('style', ''+width_px+'px;height:'+height_px+'px;border:solid 1px #000;text-align:center');
    tmpNode.innerHTML=width+"*"+height+"("+width_px+"*"+height_px+")";
    document.getElementById("testDiv").appendChild(tmpNode);
    }else{
    document.getElementById("testDiv1").setAttribute('style', ''+width_px+'px;height:'+height_px+'px;border:solid 1px #000');
    }

    }
    //根据毫米算DPI
    function cm2px(cm) {
    var dpi = getDPI();
    var pixel = parseFloat(cm) / 25.4 * dpi[0]; //只计算x轴的dPI
    return (parseInt(pixel))
    }


    function getDPI() {
    var arrDPI = new Array();
    if (window.screen.deviceXDPI != undefined) {//ie 9
    arrDPI[0] = window.screen.deviceXDPI;
    arrDPI[1] = window.screen.deviceYDPI;
    }else {//chrome firefox
    var tmpNode = document.createElement("DIV");
    tmpNode.style.cssText = "1in;height:1in;position:absolute;left:0px;top:0px;z-index:99;visibility:hidden";
    document.body.appendChild(tmpNode);
    arrDPI[0] = parseInt(tmpNode.offsetWidth);
    arrDPI[1] = parseInt(tmpNode.offsetHeight);
    tmpNode.parentNode.removeChild(tmpNode);

    }
    return arrDPI;
    }
    console.log("dpi:"+getDPI());
    </script>
    </html>

  • 相关阅读:
    编译原理入门以及战大作业心得(2)汇编简易入门 康某
    简易聊天对话框(源码)
    用js做数字字母混合的随机四位验证码
    HTML5基础
    javascript基础
    jquery.AutoComplete 仿百度文本框感应
    DropDownlist显示树状
    利用 System.Net.Mail 实现邮件发送功能
    sql 根据字段值,查找属于哪个表中的哪个字段
    sql 查看数据库中的各表的大小
  • 原文地址:https://www.cnblogs.com/q149072205/p/9714664.html
Copyright © 2020-2023  润新知