怎样用css3做一个类似阿拉丁特效的嵌有动态画图的canvas的窗体

题目有点大,实施比较难。项目中需要弹出窗体逐渐全屏,关键是窗体里边是一个canvas,并且是在bootstrap的框架中。
先说尝试的几个方法:1、用screenfull.js[url]https://github.com/sindresorhus/screenfull.js[/url],全屏可以,但是这样屏蔽了bootstrap的其他弹出窗体功能。
2、采用jquery的动画,应该是好的方案,经实验能够实现逐渐放大。但是问题是窗体内容是canvas而不是图片。结果还是不行。
3、用bootstrap自己带的弹出窗体。关键还是一样。在这个弹出窗体上不能再有弹出窗体了。同样,也屏蔽了原先的弹出窗体。
4、自己用css3搞。
为此专门设计了一个步骤:
1、首先canvas根据屏幕大小生成一张图片作为背景,这样就能避免窗口缩放发生的图像失真问题。
2、动画完成后,撤掉图片,看canvas是否有设置透明度的属性。然后显现出canvas。这样应该可以。先试着做一下。

最后做完,用javascript结合jquery。然后闪烁背景用css3动画特效。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值