是否可以通过mousemove绘制线条而不使用jquery中的canvas

时间:2014-01-18 06:23:27

标签: jquery html5 canvas

使用canvas我们可以在mousemove时绘制线条。我需要知道是否可以在jquery中通过鼠标事件使用画布来绘制线条。

1 个答案:

答案 0 :(得分:1)

我认为有可能:

使用此:

    <html>
    <head>
    <title> Bob the Painter </title>
    <style type="text/css">
    td{
    width:10px; /*Change it As You want */
    height:10px;
    background:#ffffff;
    border:0px;
    cursor:crosshair;
    }
    </style>
    <script type="text/javascript">
    function drawLine(x){
    x.style.background="#000000"; /* Use Color Picker for More Colors */
    }
    function drawmyTable(x,y){
    var ground=document.getElementById("html");
    var p="<table border=1 cellspacing=0 cellpadding=0>";
    for(var i=0;i<x;i++){
    p+="<tr>";
    for(var j=0;j<y;j++){
    p+="<td onMouseOver='drawLine(this);'></td>";
    }
    p+="</tr>";
    } 
    p+="</table>";
    ground.innerHTML+=""+p+"";
    }
    </script>
    </head>
    <body OnLoad="drawmyTable(50,50);" id="html">
    </body>
    </html>

它将创建一个包含您指定尺寸的表格,当您将单元格悬停在表格中时,它将更改其背景颜色。移动鼠标时,它会将路径的背景颜色更改为black。 当然,这并不像<canvas>那么准确,但它在旧版浏览器中很有用。

希望这会帮助你!干杯!!