欧美一区二区三区老妇人-欧美做爰猛烈大尺度电-99久久夜色精品国产亚洲a-亚洲福利视频一区二区

html5制作簡單畫板代碼怎么寫

本篇文章給大家分享的是有關html5制作簡單畫板代碼怎么寫,小編覺得挺實用的,因此分享給大家學習,希望大家閱讀完這篇文章后可以有所收獲,話不多說,跟著小編一起來看看吧。

10年積累的成都做網站、成都網站制作、成都外貿網站建設經驗,可以快速應對客戶對網站的新想法和需求。提供各種問題對應的解決方案。讓選擇我們的客戶得到更好、更有力的網絡服務。我雖然不認識你,你也不認識我。但先網站設計后付款的網站建設流程,更有茄子河免費網站建設讓你可以放心的選擇與我們合作。

HTML5制作簡單畫板

代碼如下:


<!DOCTYPE HTML>
<html lang="en-US">
<head>
   <title></title>
   <meta charset="UTF-8">
   <script src="<a href="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script">http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script</a>>
</head>
<style>
canvas{ border:2px solid #000;}
</style>
<body>
   <canvas id="draw" width="500" height="500"></canvas>
   <script type="text/javascript">
   $(document).ready(function(){
   var canvas=document.getElementById("draw");
   var draw=canvas.getContext("2d");
   draw.lineWidth=5;        //線條粗細
   draw.strokeStyle="red";    //顏色
   var godraw=false;        
   
       //按下鼠標
   $("#draw").mousedown(function(e){
       //準確坐標
   var mouseX=e.pageX-this.offsetLeft;
   var mouseY=e.pageY-this.offsetTop;
   draw.moveTo(mouseX,mouseY);
   godraw=true;</p> <p>    })
       //放開鼠標
       $("#draw").mouseup(function(e){
   godraw=false;
   })
       //移動鼠標
       $("#draw").mousemove(function(e){
       if(godraw){
   var mouseX=e.pageX-this.offsetLeft;
   var mouseY=e.pageY-this.offsetTop;
   draw.lineTo(mouseX+4,mouseY+4);
   draw.stroke();
       }</p> <p>    })
   
   })
   </script>
</body>
</html>



效果圖

html5制作簡單畫板代碼怎么寫

以上就是html5制作簡單畫板代碼怎么寫,小編相信有部分知識點可能是我們日常工作會見到或用到的。希望你能通過這篇文章學到更多知識。更多詳情敬請關注創(chuàng)新互聯(lián)行業(yè)資訊頻道。

文章標題:html5制作簡單畫板代碼怎么寫
URL網址:http://chinadenli.net/article2/gogoic.html

成都網站建設公司_創(chuàng)新互聯(lián),為您提供網站制作建站公司網站導航品牌網站建設企業(yè)建站搜索引擎優(yōu)化

廣告

聲明:本網站發(fā)布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經允許不得轉載,或轉載時需注明來源: 創(chuàng)新互聯(lián)

成都網站建設公司