Javascript 围绕html5中的中心轴旋转内容

所以我是一名平面设计师，我被要求为客户的新网站开发一个概念。这是一个内容有限的微型网站。我的想法是将网站的所有部分放在div上，然后在用户单击菜单链接时像轮子一样旋转它们。我需要了解的是：是否可以使用html5围绕中心轴点旋转包含正常内容的整个div？旋转需要设置动画。每个旋转的div中包含的内容需要与其容器div同步旋转。如果可能，如何旋转

我在谷歌上搜索了一下，找到了使用CSS3进行轮换的例子，我也看到了html5的转换，但我不确定我以前是否见过如此复杂的东西，我找不到任何可以解决的例子。所以我有点担心，由于某些原因，这实际上是不可能的。我也愿意使用javascript之类的东西来实现这一点

您可以执行以下操作：

HTML

---

您可以添加一些简单的js来更改容器当前的类。

查看这里的示例-这样，每个容器div包含的所有内容也会旋转吗？是的。整个元素将旋转。

<div class="container">
    <div class="first">First</div>
    <div class="second">Second</div>
    <div class="third">Third</div>
</div>

.container {
    transition: transform 1s;
    transform: rotate(0);
    position: relative;
}

.container>div {
    position: absolute;
}

.container.second {
    transform: rotate(120deg);
}

.container.third {
    transform: rotate(240deg);
}

.container .first {
    bottom: 0;
    right: 0;
    transform: rotate(120deg);
}

.container .second {
    left: 0;
    right: 0;
    transform: rotate(240deg);
}