首页游戏新闻鼠标写字板(电脑写字板怎么用鼠标写字)

鼠标写字板(电脑写字板怎么用鼠标写字)

更新时间：2024-03-26 4:55:30 分类：游戏新闻浏览：1

其实鼠标写字板的问题并不复杂，但是又很多的朋友都不太了解电脑写字板怎么用鼠标写字，因此呢，今天小编就来为大家分享鼠标写字板的一些知识，希望可以帮助到大家，下面我们一起来看看这个问题的分析吧！

土土上线啦！今天给大家分享的是用canvas来制作一个简单的写字板，实现用鼠标在屏幕上写字。

<!DOCTYPEhtml>\\n<html>\\n\\t<head>\\n\\t\\t<metacharset="utf-8"/>\\n\\t\\t<title>canvas写字板</title>\\n\\t\\t<scriptsrc="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>\\n\\t\\t<scriptsrc="js/canvas.js"type="text/javascript"></script>\\n\\t\\t<style>\\n\\t\\t\\t#myCanvas{\\n\\t\\t\\t\\tbackground-color:black;\\n\\t\\t\\t\\tborder-radius:5px;\\n\\t\\t\\t\\tposition:absolute;\\n\\t\\t\\t\\tmargin-left:402px;\\n\\t\\t\\t\\topacity:0.5;\\n\\t\\t\\t}\\n\\t\\t</style>\\n\\t</head>\\n\\t<body>\\n\\t\\t<canvasid="myCanvas"width='1000'height='500'></canvas>\\n\\t\\t<buttonid="clearCanvas"style="position:absolute;margin-left:200px;">清空画布</button>\\n\\t</body>\\n</html>canvas.js(写在js文件夹）

$(document).ready(function(){\\nvarmyContext=document.getElementById('myCanvas').getContext('2d');//返回绘图环境，即二维绘图\\n\\t\\t\\tvarmyClickX=newArray();//存放x坐标\\n\\t\\t\\tvarmyClickY=newArray();//存放y坐标\\n\\t\\t\\tvarmyClickDrag=newArray();//\\n\\t\\t\\tvarmyPaint;//定义一个参数，判断画板状态\\n\\t\\t\\n\\t\\t\\n\\t\\t\\tfunctionaddClick(x,y,dragging){\\n\\t\\t\\t\\tmyClickX.push(x);//存放x坐标\\n\\t\\t\\t\\tmyClickY.push(y);//存放y坐标\\n\\t\\t\\t\\tmyClickDrag.push(dragging);//状态\\n\\t\\t\\t}\\n\\t\\t//写字\\n\\t\\t\\tfunctionredraw(){\\n\\t\\t\\t\\tmyContext.strokeStyle='green';//画笔颜色\\n\\t\\t\\t\\tmyContext.lineJoin='round';//笔尖样式\\n\\t\\t\\t\\tmyContext.lineWidth=5;//画笔粗细\\n\\t\\t\\t\\tfor(vari=0;i<myClickX.length;i++){\\n\\t\\t\\t\\t\\tmyContext.beginPath();//beginPath()方法开始一条路径，或重置当前的路径。\\n\\t\\t\\t\\t\\tif(myClickDrag[i]&&i){\\n\\t\\t\\t\\t\\t\\tmyContext.moveTo(myClickX[i-1],myClickY[i-1])//moveTo()方法把路径移动到画布中的指定点，不创建线条。\\n\\t\\t\\t\\t\\t}else{\\n\\t\\t\\t\\t\\t\\tmyContext.moveTo(myClickX[i]-1,myClickY[i])\\n\\t\\t\\t\\t\\t}\\n\\t\\t\\t\\t\\tmyContext.lineTo(myClickX[i],myClickY[i]);//lineTo()方法添加一个新点，然后创建从该点到画布中最后指定点的线条（该方法并不会创建线条）。\\n\\t\\t\\t\\t\\tmyContext.closePath();//closePath()方法创建从当前点到开始点的路径。\\n\\t\\t\\t\\t\\tmyContext.stroke();//stroke()方法会实际地绘制出通过moveTo()和lineTo()方法定义的路径。默认颜色是黑色。\\n\\t\\t\\t\\t}\\n\\t\\t\\t}\\n\\t\\t\\n\\t\\t\\t$('#myCanvas').mousedown(function(e){\\n\\t\\t\\t\\tmyPaint=true;//正在画\\n\\t\\t\\t\\taddClick(e.pageX-this.offsetLeft,e.pageY-this.offsetTop);\\n\\t\\t\\t\\tredraw();\\n\\t\\t\\t})\\n\\t\\t\\n\\t\\t\\t$('#myCanvas').mousemove(function(e){\\n\\t\\t\\t\\tif(myPaint){//判断状态\\n\\t\\t\\t\\t\\taddClick(e.pageX-this.offsetLeft,e.pageY-this.offsetTop,true);\\n\\t\\t\\t\\t}\\n\\t\\t\\t\\tredraw();\\n\\t\\t\\t})\\n\\t\\t\\t$("#myCanvas").mouseup(function(){\\n\\t\\t\\t\\tmyPaint=false;//没有操作\\n\\t\\t\\t})\\n\\t\\t//橡皮檫\\n\\t\\t\\t$('#clearCanvas').click(function(){\\n\\t\\t\\t\\tmyContext.fillStyle='black';//设置背景颜色\\n\\t\\t\\t\\tmyContext.fillRect(0,0,1000,500)//绘制背景矩形,无填充颜色\\n\\t\\t\\t\\tmyClickX=[];\\n\\t\\t\\t\\tmyClickY=[];\\n\\t\\t\\t\\tmyClickDrag=[];\\n\\t\\t\\t})\\n\\t\\t\\t})

效果图

关于鼠标写字板，电脑写字板怎么用鼠标写字的介绍到此结束，希望对大家有所帮助。

相关文章

babycat98女rapper免费(我喜欢这个98年出生的日本女rapper是另有目的)

各位老铁们，大家好，今天由我来为大家分享babycat98女rapper免费，以及我喜欢这个98年出生的日本女rapper是另有目的的相关问题知识，希望对大家有所帮助。如果可以帮助到大家，还望关注收藏下本站，您的支持是我们最大的动力，谢谢大家了哈，下面我们开始吧！1、有什么目的呢？当然是希望你也能点开推文，发现这个宝藏女孩！2、你就失落吧一路跌倒谷底也不要叫我宝贝…”3、看日剧《东京男子图鉴》的时…

zz 2024-04-02 00:17:24

热门资讯

b612咔叽 b612咔叽相机

大家好，今天来为大家解答b612咔叽这个问题的一些问题点，包括b612咔叽相机也一样很多人还不知道，因此呢，今天就来为大家分析分析，现在让我们一起来看看吧！如果解决了您的问题，还望您关注下本站哦，谢谢~ B612咔叽app由SNOW相机和B612合二为一，B612咔叽app是全球自拍达人的新圣地，有了B612咔叽app，自拍再也不要修图，超自然的自拍修颜效果，只需半秒就变美美哒，B612咔叽app…

zz 2024-04-02 00:14:43

热门资讯

a无限资源无限看，无限电影资源

大家好，关于a无限资源无限看很多朋友都还不太明白，今天小编就来为大家分享关于无限电影资源的知识，希望对各位有所帮助！最近想要看英文电影来营造一个英语氛围制造一些模仿的场景来提高英语听说能力但很多资源都无法在常规的视频网站上找到或者是只有vip才可以看刚好学了十点课堂的张卓讲的搜索技能就总结一下学习的内容给大家分享A.一般的经典、大众类电影，在各大主流视频网站都有如腾讯、优酷、爱奇艺、搜狐、乐视等优…

zz 2024-04-02 00:11:38

热门资讯

avi转换器下载，怎么转成avi格式

各位老铁们，大家好，今天由我来为大家分享avi转换器下载，以及怎么转成avi格式的相关问题知识，希望对大家有所帮助。如果可以帮助到大家，还望关注收藏下本站，您的支持是我们最大的动力，谢谢大家了哈，下面我们开始吧！视频怎么转成avi格式？平时在下载视频的时候，大部分都是mp4的格式，但是mp4格式的视频播放时，往往会出现画面不清晰的情况。所以很多人在下载完视频之后，都会选择使用视频转换器，将它的格式…

zz 2024-04-02 00:08:55

热门资讯

autocad2014注册机，Autocad2014软件的完整安装教程

很多朋友对于autocad2014注册机和Autocad2014软件的完整安装教程不太懂，今天就由小编来为大家分享，希望可以帮助到大家，下面一起来看看吧！最近很多网友私信我Autocad2014的安装教程，（其实Autocad2014和AutoCad2015的教程完全相似）我整理了一下，现在完整的呈现给大家。安装前一定要断网和关闭杀毒软件。1.前言：为了避免安装错误或者激活失效请在注册机文件夹先找…

zz 2024-04-02 00:05:57

authorware软件下载(浅析在Authorware中多种方法制作循环动画效果)

各位老铁们好，相信很多人对authorware软件下载都不是特别的了解，因此呢，今天就来为大家分享下关于authorware软件下载以及浅析在Authorware中多种方法制作循环动画效果的问题知识，还望可以帮助大家，解决大家的一些困惑，下面一起来看看吧！(1.大连经济技术开发区中等职业技术专业学校电工电子教研室，辽宁大连116600；2.大连大学素质教育基地，辽宁大连116622)摘要：在多年的…

zz 2024-04-02 00:02:57

网络游戏

恶魔事典下载_恶魔守护者下载

【恶魔事典下载】恶魔事典下载是一款非常有趣的冒险解谜类游戏，在这款游戏中玩家将扮演一位侦探，你需要通过自己的智慧来解开各种谜题，并且游戏的玩法十分的有趣，感兴趣的玩家快去下载游戏玩耍吧。游戏介绍一款以恐怖元素为题材的动作冒险游戏;在游戏中，你将扮演一名侦探，你的任务是调查一个神秘的案件;游戏中有很多线索需要你去发现和收集，这些线索可以帮助你解决一些难题;你也可以使用道具帮助你快速完成挑战，这样你…

cw228 2024-04-02 00:00:42

热门资讯

ARPG游戏(一款高难度快节奏的动作ARPG游戏)

大家好，如果您还对ARPG游戏不太了解，没有关系，今天就由本站为大家分享ARPG游戏的知识，包括一款高难度快节奏的动作ARPG游戏的问题都会给大家分析到，还望可以解决大家的问题，下面我们就开始吧！1、HELLO～大家好，这里是小白的每日一游推荐时间。世上的游戏千千万，有许多好玩的游戏由于缺乏宣传，所以不被广大玩家所熟知。在这里小白每天会为大家推荐一款评价很高但是不太出名的游戏～2、《奇怪的RPG（…

zz 2024-04-02 00:00:23

游戏工具

pp助手安装教程 pp助手安装步骤详解

导语：随着智能手机的普及，越来越多的人开始使用手机来下载软件。但是，有时候我们会遇到一些下载不成功、安装不方便的问题。为了解决这些问题，今天我要向大家推荐一个非常实用的软件——pp助手。它不仅可以帮助用户轻松下载各种应用，还具备强大的管理功能。下面就让我们来详细了解一下pp助手的安装教程和步骤。一、pp助手安装的介绍pp助手是一款专为iOS设备用户打造的应用商店，它提供了海量的精品应用和游戏资…

cw228 2024-04-01 23:57:37

热门资讯

aquapark io，多人水上滑道竞速手游

这篇文章给大家聊聊关于aquapark io，以及多人水上滑道竞速手游对应的知识点，希望对各位有所帮助，不要忘了收藏本站哦。《aquapark.io》(水上公园大乱斗)是由国外知名的游戏发行商VOODOO即毒厂推出的一款竞技题材竞技手游。玩家在游戏中将选择一个可爱的玩偶小人，在漫长的水上滑道中与其他玩家同场竞技，借助各种手段，争取第一个冲过终点，最终获得比赛的胜利。《aquapark.io》的主题…

zz 2024-04-01 23:57:18