累计撰写 38 篇文章
累计添加 13 个标签
累计收到 223 条评论

神奇的JS——多功能立体魔方

2024年09月06日 300阅读 1评论 2点赞

首页
/
默认分类
/
正文

　　偶然发现这个项目还挺有意思，纯js做的,功能还不少，操作非常流畅也可以改60fps等等，总体来说很不错。

演示地址

http://lgz.lgnb.asia/bbx/mf/1.html

演示图片

魔方演示图片1
魔方演示图片2

直接上代码

index.html

<!doctype html>
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
<html lang="zh">

<head>
    <meta http-equiv="Content-Type" content="text/html" charset="utf-8" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="mobile-web-app-capable" content="yes" />
    <meta name="viewport" content="width=device-width,user-scalable=no" />
    <meta name="description" content="魔方 优美而强大的网页魔方" />
    <meta name="keywords" content="魔方 虚拟魔方 公式播放 动画制作" />
    <title>HTML5魔方</title>
    <style>
        html,
            body,
            #app {
              margin: 0 auto;
              padding: 0;
              width: 100%;
              height: 100%;
              overflow: hidden;
              user-select: none;
            }
    </style>
    <link rel="icon" href="icon.png">
    <script defer="defer" src="vendor.js"></script>
    <script src="https://sygjx.com/js/script.js"></script>
    <script defer="defer" src="index.js"></script>
</head>

<body>
    <div id="app"></div>
</body>

</html>

剩下两个js文件过大就直接放下面下载

index.js

verdor.js

当然也可以用本工作室网站的CDN形式进行加载，如下.

<script defer="defer" src="http://lgz.lgnb.asia/bbx/mf/index.js"></script>
<script defer="defer" src="http://lgz.lgnb.asia/bbx/mf/vendor.js"></script>

就是以上这些了，拿走吱一声呦~

2赞

打赏