gsap+Physics2DPlugin3模拟扑克牌发牌动画效果代码
代码语言:html
所属分类:动画
代码描述:gsap+Physics2DPlugin3模拟扑克牌发牌动画效果代码
代码标签: gsap Physics2DPlugin3 模拟 扑克 牌 发牌 动画
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> :root { --noise:url("data:image/svg+xml,%3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.25' numOctaves='1' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E") } body { height:100vh; display:grid; place-items:center; perspective:1000px; overflow:hidden } body * { transform-style:preserve-3d; box-sizing:border-box } body::after { content:""; position:absolute; background:var(--noise) 0/25vh repeat; mix-blend-mode:soft-light; width:100%; height:100% } .table { position:absolute; top:0; left:0; width:100%; height:100%; background:linear-gradient(to top,#206825,#449b45) } .deck { position:absolute; width:30vmin; height:calc(30vmin *(3.5 / 2.5)); bottom:0; left:50%; transform:translate(-50%,35%) rotatex(45deg); z-index:10 } .card { width:30vmin; height:calc.........完整代码请登录后点击上方下载按钮下载查看
网友评论0