为了账号安全,请及时绑定邮箱和手机立即绑定

已采纳回答 / 霞_霞
var wid = 800, hei = 600, canvas = document.getElementById('canvas'), ctx = canvas.getContext('2d'), clippingRegion = {}, radius = 70, theAnimation; //控制show动画canvas.width = wid;canvas.height = hei;var image = new Image();image.src = 'img/1.jpg';image.onl...
就是遮照技术吗。
放慢至0.5X 有惊喜
好;非常喜欢
修复的也不完全,又出现其他问题~~~~~~~(>_<)~~~~
跟着老师的代码打了一遍,终于把效果搞定了!老师真不错
额,我的放大后,图片和canvas不在一个位置了,有偏移量
bug修改:给半径归位
function show(img,clippingRegion){
clippingRegion.r=radius;
var theAnimation= setInterval(function(){//点击show展示清晰动画
clippingRegion.r+=20;
if(clippingRegion.r>1000){
clearInterval(theAnimation);
}
draw(img,clippingRegion);
},30)
}
貌似这个会有一个BUG 点完show后 立即点击 reset 不会归位。 要show的定时器结束后在点击就不会了。
filter:blur(5px);模糊
老师你太时尚了, 这功能刚出来,你就出课程了。
课程须知
需掌握canvas的基本用法。建议先学习《炫丽的倒计时效果Canvas绘图与动画基础》,《Canvas绘图详解》与《Canvas玩转图像处理》三门课程中的基础部分。更详细的课程所需基础知识,可参见本课程1-2小节。
老师告诉你能学到什么?
实现中图像模糊,图像展示效果; 深入了解canvas; 完成能同时运行在多端的移动web app。

微信扫码,参与3人拼团

意见反馈 帮助中心 APP下载
官方微信
友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!

本次提问将花费2个积分

你的积分不足,无法发表

为什么扣积分?

本次提问将花费2个积分

继续发表请点击 "确定"

为什么扣积分?

举报

0/150
提交
取消