画布-画板-CSS调整大小

时间:2018-10-02 20:43:32

标签: javascript css html5 canvas

我正在使用zipso.net画板的变体。

我一切都很好,草绘并保存。但是当我去改变画布尺寸时。一切都变得混乱,垫子无法正确绘制。

这在画布上很好用:

    #sketchpad {
      height:400;
      width:500;
      border:2px solid #888;
      border-radius:4px;
      position:relative; /* Necessary for correct mouse co-ords in Firefox */
     }

     <canvas id="sketchpad" width="500" height="400"></canvas>

但是当我尝试调整设备尺寸时。画布会调整大小,但绘图不会调整大小。一切都被打扰了。

    #sketchpad {
      max-height:80%;
      height:800;
      max-width:95%;
      width:1500;
      border:2px solid #888;
      border-radius:4px;
      position:relative; /* Necessary for correct mouse co-ords in Firefox */
     }

     <canvas id="sketchpad" style="max-width:95%;width:1500px;max-height:80%;height:800px"></canvas>

我在下面的javascript中看不到任何高度/宽度调用。

https://zipso.net/a-simple-touchscreen-sketchpad-using-javascript-and-html5/

0 个答案:

没有答案