w3hello.com logo
Home PHP C# C++ Android Java Javascript Python IOS SQL HTML videos Categories
is it possible to draw lines by mousemove without using canvas in jquery

I think it is possible:

Use this:

    <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>

It'll create a table with dimensions you specified and when you hover the cell in table it'll change its background color. When you move mouse it'll change the background color of path to black. ofcourse this isn't as much accurate that of <canvas> but it is useful in older browsers.

Hope This'll Help you ! Cheers !!





© Copyright 2018 w3hello.com Publishing Limited. All rights reserved.