当前位置：Gxlcms > JavaScript > js模拟画笔效果_javascript技巧

js模拟画笔效果_javascript技巧

时间：2021-07-01 10:21:17 帮助过：85人阅读

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> 
    <head> 
        <meta http-equiv="Content-Type" content="text/html; charset=GB2312" /> 
        <title>模拟画笔效果</title> 
        <script language="JavaScript" type="text/javascript"> 
            var ballW = 10,ballH = 10; 
            document.onmousemove = function(evt){ 
                var evt=evt?evt:window.event; 
                var posX=evt.clientX; 
                var posY=evt.clientY; 
                var newDiv=document.createElement("div"); 
                document.body.appendChild(newDiv); 
                newDiv.style.width=ballW+"px"; 
                newDiv.style.height=ballH+"px"; 
                newDiv.style.backgroundColor="red"; 
                newDiv.style.position="absolute"; 
                newDiv.style.left=posX-(ballW/2)+"px"; 
                newDiv.style.top=posY-(ballH/2)+"px"; 
                 
            } 
        </ script> 
    </head> 
    <body> 
    </body> 
</html>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

js模拟画笔效果_javascript技巧

人气教程排行