matterjs实现时间沙漏漏斗物理重力动画效果代码

代码语言:html

所属分类:动画

代码描述:matterjs实现时间沙漏漏斗物理重力动画效果代码

代码标签: matter 时间 沙漏 漏斗 物理 重力 动画

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!doctype html>
<html>

<head>
    <meta charset="utf-8">

    <style>
        body {
	margin:0;
	overflow:hidden;
	background:#2942b0;
}
button {
	position:absolute;
	top:10%;
	left:50%;
	transform:translateX(-50%);
	z-index:1;
	width:100px;
	height:40px;
	border-radius:5px;
	font-size:18px;
	color:white;
	background:transparent;
	border:1px solid white;
	transition:all .3s ease-in-out;
	cursor:pointer;
}
button:hover {
	background:white;
	color:#8785a2;
}
canvas {
	transition:transform 1s ease;
}
canvas.flip {
	transform:rotate(180deg);
}

    </style>
</head>

<body>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/matter.js"></script>
    <button onClick="app.flipCanvas()".........完整代码请登录后点击上方下载按钮下载查看

网友评论0