魔方变换
*问题描述:想要实现一个3D魔方,魔方不停的在旋转,且魔方每个面都由9个部分组成,每个部分也有一定的动画效果
具体的要求请参见MOOC北京林业大学(Web前端开发课程)
*HTML代码+JS代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>魔方测试</title>
<link type="text/css" rel="stylesheet" href="webstyle.css">
</head>
<body>
<div id="container">
<div class="mfbox">
<div class="box-sheet top"></div>
<div class="box-sheet bottom"></div>
<div class="box-sheet left"></div>
<div class="box-sheet right"></div>
<div class="box-sheet font"></div>
<div class="box-sheet behind"></div>
</div>
</div>
<script>
var lists=document.querySelectorAll(".box-sheet")