课程/HTML/CSS/前端开发
canvas实现星星闪烁特效
-
-
君昊
2020-08-08
- ^_^^_^^_^ ^_^^_^^_^ de
哦
-
0赞 · 0采集
-
-
Hello_my_new_world
2019-02-20
基本操作:
-
截图
0赞 · 0采集
-
-
myfly2015
2018-11-20
ctx.save()
// 这里的代码只对画星星起作用
ctx.drawImage()
ctx.restore()
-
0赞 · 0采集
-
-
佛系少女
2018-01-25
- drawImage()的三种用法
-
截图
0赞 · 0采集
-
-
佛系少女
2018-01-25
- 星星效果
-
截图
1赞 · 1采集
-
-
佛系少女
2018-01-25
- requestAnimFrame:根据你的设备性能来规定延迟时间。效率更好
setTimeout:在time秒后调用function
setInterval:先执行function,每time秒在执行function
-
0赞 · 0采集
-
-
佛系少女
2018-01-25
- 循环调用的三种方法
-
截图
0赞 · 0采集
-
-
慕标4516508
2017-12-07
- canvas的APIdrawImage
-
0赞 · 0采集
-
-
shadowbl
2017-09-20
- requestAnminFrame(function())
setTimeout(function(){},time);
setInterval(function(){},time);
-
0赞 · 0采集
-
-
ForYouSingleCycle
2017-05-16
- 三种循环的API
-
截图
0赞 · 0采集
-
-
慕姐0543543
2017-05-15
- 序列帧
-
0赞 · 0采集
-
-
qq_月倾倾的思念_0
2017-04-26
- 老师,故意绕了一个圈子
var starObj = function (){ //创建函数对象为starObj
this.x=100+Math.random()*600;//x坐标值 也可以理解为属性值,這了进行随机变换
this.y=150+Math.random()*300;//y坐标值
}
starObj.prototype.draw=function(){//這里才是用画布绘制星星的方法
ctx.drawImage(starPic,this.x,this.y);//ctx.drawImage();是画布中的函数。
}
這样就可以了
-
1赞 · 1采集
-
-
UFO2015
2017-01-18
- canvas api
-
截图
0赞 · 0采集
-
-
猎八哥
2016-12-26
- 循环 哈哈
-
截图
0赞 · 0采集
-
-
qweqwe13123123
2016-12-08
- drawImage() 播放绘画的几种参数
图片 在画布上的X 在画布上的Y
图片 在画布上的X 在画布上的Y 在画布上的宽 在画布上的高
图片 在帧上的X 在帧上的Y 帧的宽 帧的高 在画布上的X 在画布上的Y 在画布上的宽 在画布上的高
-
截图
1赞 · 0采集
-
-
qweqwe13123123
2016-12-08
- window Api
requestAnimFrame 这个定时器比较流畅 而且可以获取结束循环 跟开始循环的时间。
-
截图
0赞 · 0采集
-
-
qweqwe13123123
2016-12-08
- drawImage 绘画
globalAlpha 透明度
Save Restore 只在这一组代码直接才执行的代码。
-
截图
0赞 · 0采集
-
-
qweqwe13123123
2016-12-07
- 鼠标移入移出判断。
-
截图
0赞 · 0采集
-
-
qweqwe13123123
2016-12-07
- 在init函数里面 添加一个鼠标移动监听事件。添加范围判断
-
截图
0赞 · 0采集
-
-
qweqwe13123123
2016-12-07
- 在init函数里面 添加一个鼠标移动监听事件。添加范围判断
-
截图
0赞 · 0采集
-
-
qweqwe13123123
2016-12-07
- 随机位移部分。
-
截图
0赞 · 0采集
-
-
qweqwe13123123
2016-12-07
- 新建两个 x y的参数
然后随机改变x y的值。注意改变thisX Y 值需要在生成五十个星星的函数里面改变。
-
截图
0赞 · 0采集
-
-
qweqwe13123123
2016-12-06
- 实在无法理解 这里的if判断 是做什么用的。
-
截图
0赞 · 2采集
-
-
qweqwe13123123
2016-12-06
- 在绘画完毕的函数里面获取 上一次结束的 now
在绘画中的函数里面获取 下一次开始的 now
得出 deltatime。
-
截图
0赞 · 0采集
-
-
qweqwe13123123
2016-12-06
- 记得把 新建的update 放到函数中 循环绘画
-
截图
0赞 · 0采集
-
-
qweqwe13123123
2016-12-06
- drawImage 的属性有这么多(img,sx,sy,swidth,sheight,x,y,width,height)
img 图片元素
sx 序列帧的x轴
sy 序列帧的y轴
swidth 帧的宽
sheight 帧的高
x 在画布的x轴
y 在画布的y轴
width 在画布的 宽
height 在画布的 高
-
截图
0赞 · 0采集
-
-
qweqwe13123123
2016-12-06
- 缕一缕终于是弄懂了这里写的是什么了,这里同样用了一个for循环给每一个obj对象push到数组里面,然后用写的 匿名函数init 给每一个对象增加x y 坐标。
-
截图
1赞 · 1采集
-
-
qweqwe13123123
2016-12-06
- 这里是新建的一个匿名函数表达式
init是 获取x y的坐标
draw 是绘画星星
drawStars 封装这个函数要放到 绘画的函数里面。
-
截图
0赞 · 0采集
-
-
qweqwe13123123
2016-12-06
- drawImage(图片,在x轴的位置,在Y轴的位置,宽,高)
注意在canvas 里面的坐标不一样。
-
截图
0赞 · 0采集
-
-
qweqwe13123123
2016-12-06
- getContext 绘画2d
fillStyle 填充样式
fillRect填充
-
截图
0赞 · 0采集