用canvas结合css3写一个骰宝游戏

• Z时代
• 2024-01-10
• 分类：技术分享

这个项目预览效果： https://leeseean.github.io/sic-bo

布局

布局采用html+css布局，桌面背景使用图片，里面的选号不使用图片全部采用css编写，盅和里面的骰子采用图片。

动画效果

动画效果主要两个，

• 1个是开奖后盅摇骰子，这个使用css3的keyframe动画，用到了scale，rotate，骰子div随机变换位置和背景图片，直至最后更换为开奖选号图片。
• 一个是筹码飞出去的效果，这里用到了canvas，难点在于计算坐标和适配屏幕，计算选号坐标，然后得到飞出去的位置坐标。当屏幕收缩放大的时候可能位置会跑偏，因此还要主要适配屏幕。

主要是这么点，是个细活，源码地址：https://github.com/leeseean/s...

以上是 用canvas结合css3写一个骰宝游戏 的全部内容， 来源链接： utcz.com/a/27326.html