gsap实现点击摇骰子掷骰子获得随机点数动画效果代码
代码语言:html
所属分类:动画
代码描述:gsap实现点击摇骰子掷骰子获得随机点数动画效果代码
代码标签: gsap 点击 摇骰子 掷骰子 获得 随机 点数 动画
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@700&display=swap');
html, body {
width: 100%;
height: 100%;
overflow:hidden;
font-family: 'Roboto', sans-serif;
color:#fff;
}
.tray {
height:100%;
width:100%;
background:#000;
display:flex;
justify-content:center;
align-items:center;
}
.sum {
font-size:100px;
width:100px;
text-align:center;
padding-top:9px;
}
@media
(orientation: portrait) {
.tray {
flex-direction:column;
}
}
@media
(-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
.tray {
transform:scale(50%);
transform-origin: top left;
width:200%;
height:200%;
}
}
</style>
</head>
<body translate="no" >
<div class="tray">
<div class="die">
<div class="cube">
<div class="face"></div>
<div class="face"><.........完整代码请登录后点击上方下载按钮下载查看
网友评论0