2021年01月_编程界小明哥

12月 11月 10月 09月 08月 07月 06月 05月 04月 03月 02月 01月

原创仿360水波评分特效、加速球特效、水波动态加载动画、可改造成圆形进度条，很丝滑！

先看一下最终效果正弦曲线正弦曲线公式y = A sin(Bx + C) + D 振幅是 A，A 值越大，曲线更陡峭 B值越大周期越短 C水平位移垂直位移是 D，控制曲线上下移动实现思路首先来绘制曲线 1.定义构造函数和初始化方法//sin曲线构造函数 function drawSin(option){ this.init(option); } //初始化 drawSin.prototyp...

2021-01-27 12:56:03 3346 33

原创原来写刮刮卡这么简单，几行代码就搞定，你来你也行，谢谢惠顾！

利用属性属性 globalCompositeOperation，设置值为 destination-out，后绘制的图形会擦除与先绘制图形重叠的部分效果图：思路1.写一个div，div的内容就是刮开后的结果；2.画布设置好定位，将div盖住（此时是透明的）；3.在画布上画一个长方形，并使用颜色（这里使用默认的黑色），这就把卡盖住了；4.设置globalCompositeOperation属性为destination-out；4.为画布添加鼠标移动事件，在鼠标的位置画一个小圆，就

2021-01-26 15:39:03 3243 5

原创老婆说程序员不懂浪漫，程序员默默拿起了键盘，这就亲手带你去看流星雨，女人真的会影响男人拔刀的速度！

效果图实现思路1.写一个流星对象//定义流星雨 function Fire(){ this.x=getRandom(0,canvas.width),//流星雨的x坐标 this.y=0,//流星雨的y坐标 this.radius=getRandom(0.5,2),//流星雨的半径 this.speed=getRandom(2,4),//运行的速度 this.angle=0.6*Math.PI,//发射的方向 //this.color='white';//颜色

2021-01-26 15:16:08 1816 14

原创一个非常漂亮的圆形滑块Round Slider，可修改成圆形进度条！

滑块效果图改动百分比效果图思路首先绘制一个灰色边框的圆 ctx.translate(150,150);//坐标定位至150,150处 ctx.beginPath(); ctx.lineWidth='20'; ctx.strokeStyle='#EEEEEE'; ctx.arc(0,0,radius,0,2*Math.PI);//绘制一个完整的圆 ctx.stroke(); 再绘制一个半径一样、圆心一样蓝色的圆 ctx...

2021-01-21 16:19:21 4278 15

原创女儿说要看烟花，但是政府规定不能放，程序员爸爸默默的拿起了键盘，程序员就是要为所欲为！

一不给政府填麻烦、二给自己省银子，三给女儿带来了开心、激动，一举三得，何乐而不为！效果图：完整代码(代码里面有详细注释就不另作说明了)：<!DOCTYPE html><html> <head lang="en"> <meta charset="GBK"> <title></title> <style>body{ margin: 0; padding: 0; back

2021-01-19 19:45:10 7621 44

原创一个精美的时钟动画

完整代码，代码有注释就不说明了<!DOCTYPE html><html> <head lang="en"> <meta charset="GBK"> <title></title> <style>* { margin: 0; padding: 0;}canvas { border: 1px solid; position: absolute; margin-left: 200...

2021-01-18 17:39:46 1072 6

原创利用canvas绘制饼状图

代码中有注释，就不多说了很容易看明白 var canvas = document.getElementById('canvas'); canvas.width='600'; canvas.height='400'; var ctx = canvas.getContext('2d'); var sum=0;// 总和 var arr = [];//存储每一个扇形的值 var colors = [];//存储每一个扇形的颜色 var start = 0;//每一个扇形的开始π

2021-01-18 11:17:52 1204 1

原创用canvas来绘制柱状图，简单明了，绝对实用！

首先借助图片画一个简单的柱状图var canvas = document.getElementById('canvas'); canvas.width='300'; canvas.height='300'; var ctx = canvas.getContext('2d'); draw() function draw(){ var image = new Image();//创建Image对象 image.src='images/1.png';//指定路径

2021-01-15 21:54:19 4289 3

原创 canvas实现一个线性图

方法drawImage(image, x, y)其中image是 image 对象，x和y 是其在目标 canvas 里的起始坐标。 var canvas = document.getElementById('canvas'); canvas.width='300'; canvas.height='300'; var ctx = canvas.getContext('2d'); draw() function draw(){ var image ...

2021-01-15 20:38:08 490 1

原创 canvas绘制文字

fillText(text, x, y [, maxWidth])在指定的(x,y)位置填充指定的文本，绘制的最大宽度是可选的.strokeText(text, x, y [, maxWidth])在指定的(x,y)位置绘制文本边框，绘制的最大宽度是可选的. var canvas = document.getElementById('canvas'); canvas.width='300'; canvas.height='300'; var ctx = canvas.getCo

2021-01-15 20:27:17 2494

原创 canvas给文字增加阴影效果

var canvas = document.getElementById('canvas'); canvas.width='300'; canvas.height='300'; var ctx = canvas.getContext('2d'); draw() function draw(){ ctx.shadowOffsetX=-3;//用来设定阴影在 X轴的延伸距 ctx.shadowOffsetX=-3;//用来设定阴影在 Y轴的延伸距 ..

2021-01-15 19:32:07 2251

原创 canvas绘制跑马灯lineDashOffset、lineDashOffset

var canvas = document.getElementById('canvas'); canvas.width='300'; canvas.height='300'; var ctx = canvas.getContext('2d'); var offset=0; function draw(){ ctx.clearRect(0,0, canvas.width, canvas.height); ctx.setLineDash([10,4, 2]);//实线..

2021-01-15 18:00:59 1534

原创 canvas绘制虚线setLineDash

window.onload=function(){ ctx.beginPath(); ctx.setLineDash([]);//设定实线与空白的大小 ctx.moveTo(50,100); ctx.lineTo(250,100); ctx.stroke(); ctx.beginPath(); ctx.setLineDash([4]);//设定实线与空白的大小 ctx.moveT.

2021-01-15 17:44:52 2749 4

原创 canvas的lineCap线段端点模样和 lineJoin线段连接处模样

lineCap设置线段端点显示的模样。它可以为下面的三种的其中之一：butt，round和square，默认是butt。window.onload=function(){ var canvas = document.getElementById('canvas'); canvas.width='300'; canvas.height='300'; var ctx = canvas.getContext('2d'); ctx.beginPath(); ...

2021-01-15 17:04:43 1500 2

原创丢失api-ms-win-crt-runtime-|1-1-0.dll的解决办法

问题今天开机发现提示：丢失api-ms-win-crt-runtime-|1-1-0.dll ，导致好些软件不能打开！解决办法微软官方下载https://www.microsoft.com/zh-cn/download/details.aspx?id=4814564位系统下载 x64的，32位系统下载x86双击安装等界面看到设置成功即可等待一会成功了...

2021-01-15 09:55:17 873 1

原创 canvas绘制二次贝塞尔曲线、三次贝塞尔曲线、画爱心

方法说明quadraticCurveTo(cp1x, cp1y, x, y)绘制二次贝塞尔曲线，cp1x,cp1y为一个控制点，x,y为结束点。bezierCurveTo(cp1x, cp1y, cp2x, cp2y, x, y)绘制三次贝塞尔曲线，cp1x,cp1y为控制点一，cp2x,cp2y为控制点二，x,y为结束点。画一个二次贝塞尔曲线 window.onload=function(){ var canvas = document.getElementById('c.

2021-01-14 17:54:13 1831

原创 canvas画圆

画圆方法说明arc(x, y, radius, startAngle, endAngle, anticlockwise)该方法有六个参数：x,y为绘制圆弧所在圆上的圆心坐标。radius为半径。startAngle以及endAngle参数用弧度定义了开始以及结束的弧度。这些都是以x轴为基准。参数anticlockwise为一个布尔值。为true时，是逆时针方向，否则顺时针方向。实例1 window.onload=function(){ var canvas = document.get

2021-01-14 17:07:15 13782 1

原创 canvas绘制三角形

主要还是利用画直线的方法lineTo moveTo实例1 window.onload=function(){ var canvas = document.getElementById('canvas'); canvas.width='300'; canvas.height='300'; var ctx = canvas.getContext('2d'); //先将笔尖移动到0,0处 ctx.moveTo(100,100); //先将笔滑到200,200处..

2021-01-14 16:16:11 4105

原创 canvas绘制直线

说明： lineTo(x, y) 绘制一条从当前位置到指定x以及y位置的直线。 moveTo(x, y) 将笔移动到指定的坐标x以及y上。 stroke() 描边 lineWidth 设置线的宽度 strokeStyle 设置线条的颜色实例1 window.onload=function(){ var canvas = document.getElementById('canvas'); canvas.width='300'; canvas.height='...

2021-01-14 16:00:14 3792

原创 canvas绘制矩形

canvas提供了三个API，分别是：1.绘制一个填充的矩形 fillRect(x, y, width, height)2.绘制一个矩形的边框 strokeRect(x, y, width, height)3.清除指定矩形区域，让清除部分完全透明 clearRect(x, y, width, height)其中x、y是相对于画布左上角0,0 的距离，width是宽度，height设置矩形高度；实例1 window.onload=function(){ ...

2021-01-14 15:36:08 5968

原创 canvas基本用法

首先创建canvas元素<canvas id="canvas" width="150" height="150"></canvas>width和height 也可以不指定，canvas会初始化宽度为300像素和高度为150像素可以用CSS来指定这两个值，但如果css尺寸与初始画布的比例不一致，它会出现扭曲，所以官方建议用js来设置 width和height这两个属性。var canvas = document.getElementById('canvas'); .

2021-01-14 15:06:00 15287 1

原创史上最详细最简单的冒泡排序，一学就会，一看就懂，一面试就懵！

什么叫冒泡排序依次比较两个相邻的子元素，如果他们的顺序错误就把他们交换过来，重复地进行此过程直到没有相邻元素需要交换，即完成整个冒泡。现在设定一个数组，元素为 2,4,3,1 我们需要通过冒泡最终排序成1,2,3,4用图来说明一下:那首先我们就对第一个元素2和第2个元素4进行比较，如果第一个元素大于第2个元素则交换位置，否则不交换于是我们编写代码如下 int[] arr = new int[] { 2, 4, 3, 1 }; if(arr[0].

2021-01-13 11:31:25 29491 6

原创 jquery ajax post异步传参乱码问题

用ajax传参的时候发现会出现中文乱码，处理如下：前端传参的地方用encodeURIComponent 包裹参数的内容，如图：后台java用java.net.URLDecoder.decode 来做处理 String name = StringHelper.convertStringNull(request.getParameter("name")); name = java.net.URLDecoder.decode(name, "ut..

2021-01-12 11:18:55 525

原创用js写一个小插件，解决有些浏览器不支持模态窗口的问题，并且支持嵌套

之前遇到不能打开模态窗口的问题，我就自己封装了一个，拿出来给大家看看参数说明/* url:要打开的页面 option： title --展示的标题 height -- 消息窗口高度可以填400或者400px，缺省300px width --消息窗口宽度可以填400或者400px，缺省300px confimCall 打开的模态窗口中按钮“确定”对应的函数名，当模态窗口的页面

2021-01-11 21:13:12 666 2

原创用js封装一个分页插件，很好用，支持异步加载数据（上一页、下一页、首页、尾页）

自己写了一个分页，觉得蛮好用，放上来大家看看代码里面已经有比较详细的注释，就不解释了 <!DOCTYPE html><html> <head> <meta http-equiv="Content-Type" content="text/html; charset=GBK"> <style> *{ margin:0;padding:0; }

2021-01-11 19:30:24 1147 5

原创 java学生成绩管理系统，你的毕设我的心

当年自己学校毕业做毕设的时候，因那时网络还没有现在那么普遍，想要找个参考却也是不容易，我当时也是费了不少功夫才顺利通过答辩，所以呢最近就自己写了一个学生成绩管理系统，可以做为毕设的参考，做毕设的同学和刚入行做开发不久的同行，可以参考一下，应该会有一点的启发吧，从表的设计到代码的编写全部都是自己一手弄的，大家点个关注不过分吧！哈哈！系统介绍以学生成绩作为主题，辅以班级、学生、老师、课程、选课等管理模块（当然因为是做实例，也没有把所有的模块都涉及到）。系统角色1.adminadmin是管理.

2021-01-09 20:42:40 8823 57

原创我女儿说要看雪，于是我默默的拿起了键盘，下雪咯，程序员就是可以为所欲为！

目录效果图：初始化雪花让雪花动起来当雪花遇到边界（最下面、最右边），就重新设定参数回到最顶上，循环往下飘现在可以看到雪花了，但是雪花会一股脑的落下，不好看，所以设定一个参数来控制，一次落下多少个。运行后发现左边会没有雪，因为是往右飘的，那设置X为负的再往右飘就可以了飘雪完整代码欢迎指正！记得三连哦！效果图：初始化雪花 this.box.style.width=screenWidth+'px'; this.box.style.height=scre

2021-01-04 22:03:41 15926 62

原创原生js写的左侧飞入拼图特效，你是喜欢美女单飞还是双飞？程序员就是可以为所欲为！

目录先看效果图：实现思路：代码：欢迎指正，整理不易给个三连吧，谢谢拉！！先看效果图：单飞：双飞：完成后的页面：实现思路：1.切图：用 background:url('+url+') no-repeat -60px -60px 这种语法，将图片切成一张张小图，添加到一个数组item里面。2.在上一步中同步用数组keys存取小图的下标，9张小图的话（keys就输数字0-8的数组），同时用另外一个数组存下每个小图的坐标。3.点击开始用Math.rand

2021-01-04 11:42:40 3445 9

原创用js写的旋转木马，在新年献给各位刚登基的皇帝，让你的后宫转起来！程序员就是可以为所欲为！

目录效果图：实现的内容：代码奉上：实现原理我就不写了，代码注释的比较详细，欢迎指正！！效果图：实现的内容：1.自动向右旋转。2.点击图片自动把点击的图片旋转到最前面。3.点击向左向右，分别向左向右旋转。代码奉上： <!DOCTYPE html><html> <head> <meta http-equiv="Content-Type" content="text/html; ..

2021-01-01 11:32:08 6815 21

Java俄罗斯方块，老程序员花了一个周末，连接中学年代！

Java写的俄罗斯方块，写的挺不错！文章中有详细解释如何实现的，并有视频演示和讲解：https://blog.csdn.net/dkm123456/article/details/117675468

2021-06-09

老Java程序员花一天时间写了个飞机大战，很舒服！

老Java程序员花一天时间写了个飞机大战，文章中有视频演示，还有详细内容说明： https://blog.csdn.net/dkm123456/article/details/117265359

2021-06-09

java扫雷游戏，触雷时学姐哭着扑向了你！

用Java写的扫雷小游戏，功能实用，代码简单易懂！文章中有详细说明： https://blog.csdn.net/dkm123456/article/details/116637184

2021-06-09

老Java程序员花2天写了个连连看，我竟连不过我女儿，我了个去！

自己写的连连看小游戏，文章中有视频，还有详细说明： https://blog.csdn.net/dkm123456/article/details/117431591

2021-06-09

library.rar

用最基础的java语法开发和的web图书管理系统（jsp+servlet），很适合Java初学者和Java小白来学习web系统的制作，代码简单清晰，功能实用。文章中有视频演示，还有详细说明：https://blog.csdn.net/dkm123456/article/details/117536930

2021-06-04